X3Photo Gallery Forums

We have spent a lot of time with performance and optimization in X3, and I recommend you read my post here:
https://forum.photo.gallery/viewtopic.php?t=8512
viewtopic.php?t=8512

It's important to note that there is a big difference between #A Perceived website loading speed for the HUMAN visitors relative to what they expect from the website, and #B Rules imposed by performance-testing tools like Pagespeed, GTMetric, YSlow and Pingdom, which don't differentiate. Of course, you can only review data from B, but you can test A by simply loading a website into browser/mobile. For example, our X3 demo website, does it load fast? I assume YES, but that does not mean that Google Pagespeed will not penalize the score based on a few abstract rules.

Pingdom, GTMetrix and YSlow will normally rate X3 websites score A or 90 - 99%.

As for Google Pagespeed, it's entirely on target for websites like bbc.com, where it's critical that no unnecessary loading occurs before visitor sees the content. However, this ruleset does not quite match quality content/presentation-style website applications like X3. Some notes about Google Pagespeed:

• X3 is heavily penalized for loading CSS and FONTS before visitor sees the content [screenshot]. X3 needs to do this because CSS and fonts need to be loaded before X3 can render layout and various elements. These resources still need to get loaded anyway of course. X3 even loads the fonts and CSS from a super-fast CDN ... Try clicking the x3.skin.daylight.css, and you will see how fast it loads. Pagespeed doesn't care.
• X3 is penalized for "loading the entire page" before displaying the content [screenshot]. Same as above, X3 is like an "application", and requires loading the app before initializing. Once the main page is loaded, when you click any item in the menu, X3 only loads the new page data and does not reload any javascript/css like most other websites. Of course, Pagespeed does not take this into consideration, and instead it's penalized.
• Pagespeed penalizes for loading "Google Analytics" [screenshot]. Really? That means Google has not even optimized their own resources based on the presumptuous rules of Google Pagespeed. It also means you need to "read in between the lines".
• On mobile devices, X3 is penalized for loading "too large images" [screenshot] when using the slideshow intro plugin. Since horizontal images in a slideshow intro are usually "cropped" on mobile devices, and since X3 will "round up" image sizes to display "best quality" image to the visitor, Pagespeed will consider these images as "too large" for mobile devices and penalize the score. Image sizes are of course critical for a news website like bbc.com, but X3 is a "photo gallery" website, and attempts to display images optimized for "best quality match" to the visitor.
• X3 is penalized for not compressing JPG files "enough". X3 is a photo website, and images should have a fair balance between quality/size ... I have checked some of our own images, which have been processed in Imageoptim and further "polished" by Cloudflare, yet Pagespeed still penalizes these images because we have chosen a "fair" 90% JPG compression quality. Unless your website is bbc.com, this is just wrong.
• Furthermore, you might want to check these links:
  https://wp-rocket.me/blog/the-truth-abo ... -insights/
  https://premium.wpmudev.org/blog/why-tr ... e-you-mad/

Sorry for the long answer, but I personally find it annoying that Pagespeed somewhat misleadingly penalizes without taking anything into context. Basically, you should ignore some of what Pagespeed reports.

mat321 wrote:1.  does image vue optimize image size or do you recommand any tips to optimize image size to have better size/quality setup

X3 always optimizes image size depending on the device that is viewing the images. From the perspective of a quality-oriented photo-website, there is little to gain from additional optimization. If you want to have "best" optimization for your original images, you can use an application like imageoptim prior to uploading (read this post for more info), and/or use Cloudflare to "polish" images on the fly (which only applies if your images can be further optimized, which often they cannot). Also note, even if you apply best optimization on all your images, Google Pagespeed will still penalize images that it considers "not compressed enough", which is often unacceptable compression levels for a photo website. I wrote a guide about optimizing images:
Optimizing Images for Photo Gallery Websites

mat321 wrote:2. i don't have cdn, do use recommend it and how to use with imagevuex ?

Does your website have a global audience? If so, then using a CDN may provide a notable difference for visitors located far away from your server. If most of your visitors are located in same country (or same continent) as your HOSTING, and as long as your hosting performs acceptably (most do), using a CDN will not provide much benefit. Furthermore, even if you use a CDN, it will not change your score from Google Pagespeed ... Google Pagespeed doesn't even CARE (or know) that an image/asset is served from a CDN (like our X3 demo website). Just another point that there is difference between what a "human" perceives as speed, and what Pagespeed will report.

You can however easily use a CDN service like Cloudflare (read my post) or Amazon Cloudfront with X3.

PS! X3 already loads core javascript and CSS from our Amazon Cloudfront CDN. Pagespeed does not care.

mat321 wrote:3. Do i have to listen all google insigh speed tell me ?

Basically no. Check other performance tools like GTMetrix and Pingdom, and manually test your website on desktop and mobile .... Does it feel sufficiently fast?

mat321 wrote:for example i tell me activate gzip and its already done with 99% of score at gtmetrix.

This sounds a bit suspicious. Do you have a link to your website so I can test? Some hosting services do not allow GZIP, but this is not necessarily critical. For example, a html document at 10KB may be GZIPPED as 4KB, but that does not always make it faster to load from gzip, because gzip takes additional time to process from the server.

mat321 wrote:- optimize https://d30xwzl2pxzvti.cloudfront.net/c ... ylight.css
- reduce css, javascript, html

I believe I have answered these issues in my main points about Google Pagespeed above.

mat321 wrote:- exploit cache navigateur (french sorry)

I believe this is the point about "Google Analytics" [screenshot]? You can't change cache-headers from external files. Of course, ironically, this is Google's own resource which Pagespeed is penalizing. There is nothing wrong with the cache headers of this file, since Google needs to update this script occasionally, but Pagespeed just simply doesn't take anything into consideration.

Basically, you should not read much into Pagespeed, which reports many "trivial" factors that may be critical for websites like bbc.com, but do not apply in real life for photo-oriented website applications like X3.