CSS/JS code issues -> Google PageSpeed Insights
-
Hi 3D FlipBook team,
1st I want to say that your plugin is really great and that we’re happy you’ve also a great and really EASY to use documentation for customizations.
Sadly the code behind your plugin seems not to be 100% perfect So we ask you to patch some things.
1st of all you didn’t implement “font-display: swap;” into your “themify-icons.css” / “themify-icons.min.css”. We’ve updated that by hand locally now but like to see that in an update (https://developer.chrome.com/docs/lighthouse/performance/font-display/).
I’d like it most, if one didn’t had to use that themify font at all (maybe via settings choice). And also not the Dashicons because we unload them for all our projects. Isn’t there another possibility to use SVG fonts or self-hosted fontawesome or something like that?
Next point is preventing outdated JavaScript from being served in modern browsers. https://pagespeed.web.dev/ is full of warnings about pdf.min.js, and three.min.js
mockup.min.js uses passive listeners, but Google says: “Do not use passive listeners to improve scrolling performance“.
A HUGE performance increase would be lazy loading for the dflips!
For more than one flipbook you have the thumbnail solution which is absolutely fine. But we want to show the newest magazine issue directly on our home page way down the page. Sadly without lazy loading your plugin loads directly and slows down page readyness. Only a bit but that could be avoided via lazy loading.
Thank you in advance and best regards
-
Hi
Thank you for your feedback. We are well aware of these issues. We have been working continuously on the plugin. It’s a complex and heavy plugin. Yet we have been learning and improving.
These are issue that are limitations with version 1 when a embedded flipbook is present, So we highly recommended using lightboxes.
We started working on new framework in version 2 and it’s really promising.
With Embedded flipbooks below the fold where lazyload can make difference:
- We still use font-display:block. swap works good when the font is text font not icon font. Rather we embedded the font into CSS file to reduce payload. The font file doesn’t block anymore.
- JavaScripts are updated those errors and warning are not there in version 2
- Lazy load is added in version 2.1 and it’s under testing https://staging.dearflip.com/document-layouts-for-dflip-flipbook-plugin/
We may never achieve 100% and be perfect, but we can always try improving.
Version 2 will be available for lite version in July 2023.
It will take some months for version 2.1 to rollout to lite version. probably around Nov-Dec 2023. Sadly I am the only one person developing the plugin.
Best Regards,
DearHive
- The topic ‘CSS/JS code issues -> Google PageSpeed Insights’ is closed to new replies.
