Overview
In version 4.7, we released a variety of performance improvements. We’ll identify the performance updates, as well as future updates, in this article.
Before diving in, a quick note on Google’s PageSpeed Insight scores. These results are important, but they are not a true measure of performance. Google is the premiere search service that attributes search results based off their ranking metrics, and it is highly important that we take their insight into account. In this version, we have run through each of their items with the intention of increasing their Performance and Best Practices metrics.
For the other metric scores outlined in the PageSpeed Insights report:
- Accessibility
- In version 3.2 and version 4.6 we made significant updates for ADA Compliance, which resulted in an increased Accessibility score
- SEO
- Our SEO Checklist article covers a list of items to achieve a good score
- You can also submit a ticket to Extranet for assistance, where our Professional Services team, or a CIMcloud partner, can guide you in this area
- Progressive Web App (PWA)
- PWAs are not useful for sites with consistently updated content, such as eCommerce sites, and we have no plans to focus on this metric
What are the performance updates?
- Decreased Third Party Asset Load Times
- Third party assets, particularly web fonts, have been modified to load faster
- We also made modifications to ensure text remains visible during load time
- BFCache Implementation
- This does not inherently benefit performance, but it does impact PageSpeed insight scores, which will boost your rankings in search results
- Javascript and CSS Cleanup
- Modified our internal assets, cleaning up outdated code/styles, and intentionally loading JS/CSS on pages that need that logic
- Updated WYSIWYG images with CDN URLs
- WYSIWYG = What you see is what you get (e.g. the text editor on product add-edit and web pages)
- Our editor was not using the Amazon CDN URLs that is used across your sites, such as catalog pages, which we have updated. This allows these images to be cached, resulting in better performance.
- Note: You will need to POST pages where WYSIWYG images are included, or you can submit a ticket to Extranet to have your image URLs updated in your database.
- Consistent Thumbnail Image Sizes
- Thumbnail images varied between 125px and 200px. We updated containers with 125px to match the recommended 200px by 200px thumbnail image sizes
- Performance is negligible with this increase, as we cache images via Amazon Cloud services; however, it will help PageSpeed insight scores when image sizes match the container that they are in
- Explicit Image Size Declaration
- We’ve included width and height properties to certain elements containing images. This helps the content layout shift metric, as it tells the browser where elements fit into the rendered results.
What are the future performance updates?
- Further Javascript and CSS cleanup
- This has the largest impact to the download time of a site, but has the most risk associated with it
- We are carefully evaluating the changes we can make without disrupting site downtime, backwards compatibility, and future updates
- Auto-resizing images
- Currently in the discovery phase, but we are investigating an update to upload a single hi-res image, which can resize for each of the necessary containers, so that you no longer need to resize to different formats and map each file to different products/web pages/etc
- Please let us know if you believe this would be beneficial for your team!
- Further Explicit Image Size Declaration
- We concentrated on the Home page and Catalog pages, and are looking to update other areas of our core product
- Drilling into other high-traffic pages
- Most of our focus in version 4.7 is in the homepage, product detail, and search results. We plan to have the same level of focus on other high-traffic areas of your site in future updates, such as the: Login Page and Checkout Pages (cart, account, payment)