Comments (5)
According to : https://developers.google.com/web/tools/lighthouse/audits/network-payloads
The trigger size for this warning is 1600KB. Would be helpful for the message to state that.
Something like:
Your total page size exceeds 1600KB. Reduce the number of images and videos on this page. Consider displaying fewer posts/products per page if they each have an associated image, and minimize the use of sliders. Compress images and videos to reduce individual file sizes.
possibly even recommending videos be hosted on services like Youtube to reduce their footprint on initial load?
This could have different downsides. Maybe it's safer to focus on reducing the page size?
from lighthouse-stack-packs.
It's really important that WordPress-specific messaging takes into account the fact that many WordPress site owners using Google PageSpeed are NOT developers. So the wording has to be user-friendly in addition to being WordPress-specific.
By and large, the average WordPress user will not understand the terminology "network payload".
It's a good point that the specific files are listed in order of size. Would suggest the following tweak to my original proposal:
Your total page size exceeds 1600KB. Reduce the number of images and videos on this page. Consider displaying fewer posts/products per page if they each have an associated image, and minimize the use of sliders. Compress images and videos to reduce individual file sizes, starting with the largest files listed below.
And the Learn More link already directs readers to a reference article that covers different ways they can fix this (defer, compress, cache, etc...)
The PageSpeed/lighthouse docs are not WordPress-specific and not really that user-friendly in many cases :)
from lighthouse-stack-packs.
This sounds good to me. Reducing payload sizes is a pretty broad statement to begin with, but if large images/videos is a common culprit within WordPress - I think we can change the text up a bit to focus on that instead.
CC @westonruter
from lighthouse-stack-packs.
The culprit could be identified by Lighthouse, could it not? Lighthouse could have different messages for huge HTML documents vs documents that have huge images/videos, or both.
from lighthouse-stack-packs.
So the current LH audit already provides a list of network payloads in descending order of size:
And the Learn More link already directs readers to a reference article that covers different ways they can fix this (defer, compress, cache, etc...)
I'm assuming this was the reason why the current audit description is pretty broad to begin with. So on second thought, should we just omit the WordPress description entirely unless there's something pretty WordPress-specific to add?
What do you all think?
from lighthouse-stack-packs.
Related Issues (20)
- React Pack HOT 1
- Angular Pack HOT 1
- Illegal formatting in AMP stack pack HOT 1
- Drupal Stack pack HOT 2
- React stack pack HOT 5
- Typo in magento HOT 1
- React "route navigations"
- Suggestion: Ember.js Stack Pack HOT 1
- More high-level audit suggestions in the Drupal pack HOT 1
- Request list of checks Lighthouse does to write an up to stack pack HOT 1
- `time-to-first-byte` was renamed
- Drupal `uses-responsize-images` unclear HOT 2
- How do I use? HOT 1
- type gen needs some tlc
- nextjs logo is low contrast in dark mode
- Broken link in wordpress
- Add INP-related advice re: React 18
- [WordPress] Suggest the Performance Lab plugin where applicable HOT 4
- Suggestion: Improve docs to add 'offline' stack packs; build your own stack pack and recommendations HOT 5
- de-dupe some strings
Recommend Projects
-
React
A declarative, efficient, and flexible JavaScript library for building user interfaces.
-
Vue.js
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
-
Typescript
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
-
TensorFlow
An Open Source Machine Learning Framework for Everyone
-
Django
The Web framework for perfectionists with deadlines.
-
Laravel
A PHP framework for web artisans
-
D3
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
-
Recommend Topics
-
javascript
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
-
web
Some thing interesting about web. New door for the world.
-
server
A server is a program made to process requests and deliver data to clients.
-
Machine learning
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
-
Visualization
Some thing interesting about visualization, use data art
-
Game
Some thing interesting about game, make everyone happy.
Recommend Org
-
Facebook
We are working to build community through open source technology. NB: members must have two-factor auth.
-
Microsoft
Open source projects and samples from Microsoft.
-
Google
Google ❤️ Open Source for everyone.
-
Alibaba
Alibaba Open Source for everyone
-
D3
Data-Driven Documents codes.
-
Tencent
China tencent open source team.
from lighthouse-stack-packs.