Post by DrM » Mon Nov 18, 2013 4:07 am

Hi all,

Using Opencart 1.5.5.1 with upgraded store.

I found a blog that Qphoria had contributed some advice too about speeding up your opencart site:
http://cartadvisor.com/blog/2013/11/05/ ... cart-store

Speed Tip 5 is to add the 'async' after <script in the .js lines in the header.tpl file.

When I do this my site speeds up really well, performs great in all the page speed checkers etc...

However, my carousel appears to break, with the images becoming a single list of images going down the page, rather than being in the normal scrolling across format. Also, my slideshow just shows the loading symbol and doesn't bring any images up.

These are the 3 lines I edited in header.tpl:

Line 23: <script type="text/javascript" src="catalog/view/javascript/jquery/jquery-1.7.1.min.js"></script>
Line 24: <script asyn type="text/javascript" src="catalog/view/javascript/jquery/ui/jquery-ui-1.8.16.custom.min.js"></script>
Line 26: <script async type="text/javascript" src="catalog/view/javascript/common.js"></script>

As you can see, two of the 'async' ones don't appear to break anything. But when I add async into the script on line 23 the carousel and slideshow stop working properly.

Any advice would be very appreciated! Thanks.

User avatar
DrM
Newbie

Posts

Joined
Fri Mar 22, 2013 11:57 pm

Post by MarketInSG » Mon Nov 18, 2013 11:38 pm

most likely the javascript file wasn't loaded but the script is already being called for. That's why it won't load properly.


User avatar
Guru Member

Posts

Joined
Wed Nov 16, 2011 11:53 am
Location - Singapore

Post by DrM » Tue Nov 19, 2013 12:41 am

Thanks for the reply. Do you have any suggestions on how to fix this?

Google page speed insights tells me that this is holding me back. When I add the async I get 95/100 on the desktop page speed, so would obviously like to resolve this issue.

It advises me to: 'Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML'

User avatar
DrM
Newbie

Posts

Joined
Fri Mar 22, 2013 11:57 pm

Post by MarketInSG » Tue Nov 19, 2013 8:02 am

Probably not async the jquery file and the slider file. The rest you can try to async them and see what happens?


User avatar
Guru Member

Posts

Joined
Wed Nov 16, 2011 11:53 am
Location - Singapore

Post by welle93 » Tue Dec 03, 2013 5:08 pm

Have you found a solution for this problem yet ?

i have Google page speed insights telling me that both jquery-1.7.1.min.js and jquery-ui-1.8.16.custom.min.js is blocking...

New member

Posts

Joined
Mon Dec 02, 2013 5:54 pm

Post by DrM » Wed Dec 04, 2013 4:02 pm

Hi welle93. I haven't resolved this particular one, but I have got my page speed consistently up to 96/100 on the Google page speed insights. I have added async to these three lines in the header:

<script async type="text/javascript" src="catalog/view/javascript/jquery/ui/jquery-ui-1.8.16.custom.min.js"
<script async type="text/javascript" src="catalog/view/javascript/common.js"
<script async type="text/javascript" src="<?php echo $script; ?>"

This seems to work for me. But check your website in IE too.

User avatar
DrM
Newbie

Posts

Joined
Fri Mar 22, 2013 11:57 pm

Post by IP_CAM » Wed May 21, 2014 1:20 am

Oops, I wondered today, when opening my Shop Site, using my Seamonky Browser, after adding that piece of 'async' gizmo generously into all of my template header.tpl javascript lines last night. Category Sections where all screwed up, dis-aligned content, and in the product Page, my Multi-tab-section was split up into 4 individual vertically aligned single parts, displaying parts of borders around them. The Image-Changer did not work anymore, a click on a thumb produced a large View. I was pissed...

Because of possibly beeing unaware what I'm doing, sometimes, at night, I started to look for eventually modified pages, css-files, I checked Page Source, until I realized, that the only 'fundamental' change was to add 'async' to all <script...> lines in the template/common/header.tpl .

Interesting was, that my good old IE8 did not bother, it displayed, more or less, everything as usual, the Firebird Browser displayed also, more or less, at least every second reload, my product description tabs, as requested, but my rather heavy secured, 'choosy', Seamonkey got all screwed up by the sudden 'async' Situation.

This is why I like the Semonkey so much, it's NOSCRIPT Option (Firebird has it as well) allowed me to individually enable/disable scripted Linksites, when disabling some of them, suddenly, my Seamonkey reacted in a way, that showed my, where the problem must come from.

'async' or not 'async', this is the Question, when deciding to either please Google Sitecheck, or then, please the Visitors. I decided to please my Visitors, by banning 'async' from my script lines. Whenever I have my OC completed, I may find some spare time to bother about 'async' again, for the time beeing, I have more urgent matters to solve.

I just wanted to tell you guys about this, do NO JUST FILL all your script lines with 'async', it could 'keep' a lot of things on your site from doing their job, important to make the thing work from the first Visitor-Click on!

Ernie

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by OSWorX » Wed May 21, 2014 4:48 am

Only a few scripts can be running with 'async'.
Basically all those which are not needed when a program is loaded.
Slideshows and such have to be loaded at the beginning.

Full Stack Web Developer :: Dedicated OpenCart Development & Support DACH Region
Contact for Custom Work / Fast Support.


User avatar
Guru Member

Posts

Joined
Mon Jan 11, 2010 10:52 pm
Location - Austria

Post by joemaydew » Thu May 22, 2014 10:59 pm

I have the exact same problem as described in the original post. Can anyone shed any light on this?

User avatar
New member

Posts

Joined
Wed May 07, 2014 4:58 pm
Location - Staffordshire, United Kingdom

Post by IP_CAM » Fri May 23, 2014 1:26 am

What kind of light do you need? It has all been descibed in detail in many places and many forms.

Let me just act like Garner Ted Armstrong, telling you 'MY plain Truth'.
(A very 'impressive' Man, decades ago, on the radio, when I was living in Canada 69/71)

The Main Problem of 'slow loading' in certain OC Sites is not if one uses 'sync' or 'async' Javascripts, sure, they may have a certain ( but rather small) effect on page loading speed. The Main Problem is the 'huge amount of VQMod Options in many Scripts, combined with ACTIVE GIZMO Mod's like Facebook/Twitter/Google+/etc./etc. wich as well delays page load, sometimes, they even prevent a page from 'beeing' loaded to finish. As higher up placed, as worse they act...

Nobody would ever mention this 'async' thing, if the Google Pagetester would not exist. Honestly, I never had any need for this either, before coming here and reading about it, since working with this >Egg-laying wool milk Pork< type PHP Software called OC, 'cause I wanna make it fast as well...

The VQMOD IDEA is basically a giant step from how I was used to deal with, I would have liked something similar very much, screwing around with Perl-based Scripts for 15+ Years. For Testing-Purposes, it's unmatched, for Sellers, it's the best/easiest way to satisfy their Customers, because they don't have to know anything, exept for how to upload the .xml file to the server, and it works. At least, most of the time, somehow, in part, or else...

But the fact is, on a Server, AFTER everything else has been BUILT into a 'final' Template-WebPage-File, it's time to start the VQMOD-Routine. Since no 'prearranged' Indexing exists in any form, FROM ONE TO XX, all VQMOD's and EVERY of it's 'FILE ROUTINES' are needed to be compared/checked/placed, 'in Serie', not parallel, for possible DUTY, and EVERY VQMOD-COMMAND, one AFTER the other, will make the Server to create a new Template-File, based on the LAST active Template, before going to the next VQMOD, doing the same, again, again, and again, until it reaches the last One of the VQMOD's activated. After those 20, 30, 40, 50, 100 or more repeated 'Session-templates' Jobs created, the LAST one Template, containing the Result of this VQMOD-modified Product, is ready to be sent to the visitor.

As I mentioned here somwhere already, a highly enhanced 'Framework-styled' Software like OC would probably not have been of any use on a shared Server, about 10-12 Years ago. A single Pageload would have used up all of the memory available then, a 'View All' with 5'000 active Items would have brought down a Server on it's knees. Beeing aware of such, I strongly advise anyone to try to keep it's software as LEAN as possible, or then, move up to a dedicated Server, if one really plan's to offer a professional Shopping Place. It pay's out, when it comes to Business, everything else is Hobby-Type Webmaster Discussion.

It may look 'modern' to have all that surplus 'crap' installed everywhere, but just a minor quantity of Site-Owners seem to be aware about the consequences, when doing such. In addition to this, many try to install 'everything' imaginable, then, even after removing or disabling some of them, there may be still parts of 'routines', files, and whatever else, laying around all over the place, still, beeing frequently checked by some Routine-call's, not longer used as well, but still in a kind of 'standby' working stage.

Adding all this together, Scripts, VqMod's, >regular< Mod's, the only thing it now takes is a really cheap (or even free) shared Server, offered for a couple of bucks a month, where a Shop-Owner split's the IP, Network, Memory and Prozessor with a 4-figure amount of others, all trying do follow the same 'get rich quick' scheme, in one or the other way.

Then, some of them may find their way to here and ask, why is this thing so slow....

As I pointed out before, I do NOT complain, about NOTHING, I like VQMOD's very much, they make it very easy for me to find the RIGHT Places, if I want to replace/extend existing Source with other Functions. I understand and accept the Fact, that VQMOD-Sellers CANNOT give individual Source-Code-Support for 10-30 Bucks a Piece, it would be a waste of time, filled with frustrations, for all ...

I just want to point potential future PRO-Site Owners to the right direction, namely, to get their Software 'individualized' the >>> hardcoded way <<<, not just filled up with VQMOD's. Sooner or later, they will run into Problems, by doing such, anyway, and then, hardcoding still is the better way to keep a PRO OC System alive and well...

no offense...

Ernie
Last edited by IP_CAM on Fri May 23, 2014 2:35 am, edited 9 times in total.

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland

Post by OSWorX » Fri May 23, 2014 2:20 am

VQMod - and the xml-files - is not that bad overall.
Bad are some xml and how they are written or what they are doing!

Beside this modification system, there is another approach which seems to be more useful:
OpenCart Override Engine

Maybe you want to try it once Ernie and tell your experience with it here?

Full Stack Web Developer :: Dedicated OpenCart Development & Support DACH Region
Contact for Custom Work / Fast Support.


User avatar
Guru Member

Posts

Joined
Mon Jan 11, 2010 10:52 pm
Location - Austria

Post by IP_CAM » Fri May 23, 2014 2:24 am

I planned to look into this, but for now, there are still 'basic' things waiting...

Ernie

My Github OC Site: https://github.com/IP-CAM
5'200 + FREE OC Extensions, on the World's largest private Github OC Repository Archive Site.


User avatar
Legendary Member

Posts

Joined
Tue Mar 04, 2014 1:37 am
Location - Switzerland
Who is online

Users browsing this forum: No registered users and 90 guests