In a recent Meetup on Speed Matters we did some simple exercises with Google’s Page Speed Insights to illustrate the information that this free website speed tester provides. But at the same time we got some extra insights which were enlightening.
Here is the simple Elementor Gallery post using first flexbox in component layouts and then another post with flexboxes used. The design of the post was deliberately simple – a header and textbox at the top followed by a grid gallery of 9 medium-sized images with simple styling and lightbox support for each image :
Now the first insight was that indeed the mobile display was slower than desktop. But we were surprised by the amount:. Note all the results are part of Core Web Vitals: FCP is First Contentful Paint, LCP is Largest Contentful Paint and TTI is Time to Interactive – these are measures of webpage display performance.
Flex mobile speed FCP=2.1 sec LCP=4.8 sec TTI=3.8 sec versus desktop speed FCP=0.8 sec LCP=1.46 sec TTI=0.8 sec.
Surprise => Mobile speeds were consistently 3 times slower than desktop display speeds.
Next while waiting for more meetup attendees to arrive, we wanted to check the difference between Flex Elementor versus NoFlex. It is a simple test and only marginal differences were expected.
NoFlex mobile speed FCP=2.6 sec LCP=4.9 sec TTI=4.0 sec versus desktop speed FCP=0.7 sec LCP=1.5 sec TTI=0.8 sec.
The NoFlex mobile scores were 10-15% slower but the desktop results were roughly the same. Further tests need to be done to see where and by how much Flexcode does improve Elementor’s performance.
The last question, would caching, image compression, and CSS/Script management effect the speed results.
The WP-Optimize plugin can be quickly setup to deliver database cleanup, image compression, caching services plus CSS+JS minification. Here are the results:
Flex mobile speed FCP=1.4 sec LCP=3,8 sec TTI=2.9 sec versus desktop speed FCP=0.4 sec LCP=0.7 sec TTI=04 sec.
WOW! both the mobile and desktop speeds improved dramatically. The mobile speeds improved by roughly 33% while the desktop speed was cut in half by using the free WP-Optimize plugin
Summary
Google Page Speed Insights certainly provided plenty of those. Mobile speeds were consistently 2-3 times slower than desktop emphasizing that Mobile device performance optimization is a real problem. Does AMP and PWA techniques help? See AMP review here for some answers.
In the case of Elementor Flexbox run time speed saw only small mobile speed improvements. Clearly there is a need for more thorough testing. But there is no doubt that caching, database optimization, image compression and CSS/JS combination/minification had a big impact on both mobile and desktop speeds. In sum, the Meetup supplied some very useful WordPress Performance Tuning insights.