X-Cart: shopping cart software

X-Cart forums (https://forum.x-cart.com/index.php)
-   General questions (X-Cart 5) (https://forum.x-cart.com/forumdisplay.php?f=66)
-   -   HTTP/2 JS and CSS aggregation (https://forum.x-cart.com/showthread.php?t=75521)

xgarb 07-20-2017 06:23 AM

HTTP/2 JS and CSS aggregation
We've just had HTTP2 enabled on our server and it seems to have made things faster.

I'm wondering if we should switch off the aggregation for JS and/or CSS files to help with the usual render blocking elements problem?

PS: Another Google webpage tester: https://developers.google.com/web/tools/lighthouse/?hl=en

cflsystems 07-20-2017 06:52 AM

Re: HTTP/2 JS and CSS aggregation
I don't think it is a good idea to not use aggregation. XC5 has tons of css/js files so even if you do not see some page speed difference think of it as
- loading 100 files vs loading 1 file

As for the Lighthouse project regarding css/js - while XC5 loads some css/js files based on page being shown there is still tons of css/js that load based on module. So if Module A loads css/js files only because it is active they will be included regardless the page and of course if it is not Module A page will be reported as "unused". But you cannot do anything about it unless rewriting the module...
Oversized images will be reported almost all the time as XC5 loads image and shrinks it due to improper css - product images, category images, etc. The image container has a border and if you set image size to 200px for example (in admin) the image being loaded is 200px, its container is 200px but usable space is 196px (depending on border width) - image is shrinked down to 196px....

xgarb 07-20-2017 07:08 AM

Re: HTTP/2 JS and CSS aggregation
I did some tests with Lighthouse and it seems to suggest that leaving aggregation on is faster.

My thinking was with HTTP/2 you don't need to aggregate but I guess if the server and the browser are still dealing with 30 odd JS and CSS files it will slow things down.

Maybe outside of the test environment it would be quicker as the individual files are cached and can be used on any subsequent pages. As it is now.. sometimes the big aggregated files can be used on a subsequent page and other times it's another big aggregated file that has to be downloaded.

Re images.. when I design a site I use 'View Image Info' in the right click menu in Firefox to find out the actual size my images are being displayed at and then set the image creation script to make them that size.

There's an image CDN that can serve the correct image size based on the container size at the current pixel width of the page. I think mod_pagespeed does this as well. We are waiting for our host to implement this.

xgarb 08-01-2017 02:55 AM

Re: HTTP/2 JS and CSS aggregation
A question on CSS being loaded..

This code:

namespace XLite\Module\XC\CrispWhiteSkin\Module\Amazon\PayWithAmazon\View;

 * @Decorator\Depend ("Amazon\PayWithAmazon")
class AmazonCheckout extends \XLite\Module\Amazon\PayWithAmazon\View\AmazonCheckout implements \XLite\Base\IDecorator
    public function getCSSFiles()
        $list = parent::getCSSFiles();
        $list[] = [
            'file'  => 'css/less/checkout.less',
            'media' =>  'screen',
            'merge' =>  'bootstrap/css/bootstrap.less',

        return $list;

Does this add the LESS file to the list when in checkout only or (as I imagine) it's added to the giant CSS file for all pages?

I want to reduce the size on the general CSS file. It's way to big. On the X-cart demo page...

some is probably because it's the demo page but... wow! Way too much.

xgarb 08-02-2017 05:59 AM

Re: HTTP/2 JS and CSS aggregation
I've discovered the figures above are after deflation so the browser doesn't actually download those huge numbers.


All times are GMT -8. The time now is 08:09 AM.

Powered by vBulletin Version 3.5.4
Copyright ©2000 - 2022, Jelsoft Enterprises Ltd.