Site Load is too slow
skamansam opened this issue · comments
Description
When running the PSK with no code modifications against Lighthouse, it gives very low performance score across all builds due to the poor times for First Meaningful Paint, First Interactive, and Consistently Interactive.
Expected outcome
All load times are less than 3 seconds, and pass the Lighthouse performance rating with a 100.
Actual outcome
| Tested Build | First Meaningful Paint | First Interactive | Consistently Interactive | Perceptual Speed Index | Performance Score |
|---|---|---|---|---|---|
| es6-unbundled | 11,480ms | 11,480ms | 11,480ms | 12,440ms | 32 |
| es6-bundled | 3,760ms | 3,760ms | 3,760ms | 4,251ms | 78 |
| es5-bundled | 3,850ms | 3,850ms | 3,850ms | 4,331ms | 78 |
Steps to reproduce
- clone git repo
- build app with
polymer build - open in Chrome and run the Lighthouse audit tool in DevTools
I can totally agree with @skamansam because I tried exactly the same and result is very poor here is result of my lighthouse audit. in my case I did not do the build process, I just used polymer serve and then audited the app in chrome with lighthouse.
@touseefbsb I ran the bundled version because it generates the service worker and caching info, which improves the scores all around.
@skamansam To clarify, are you running this against a real server with HTTP 2 support? Or against polymer serve?
Polymer Starter Kit v3.2.0 hosted in Firebase. Preset: es5-bundled.
The performance section is not very good.
Lighthouse Report
Results for: https://psk-demo-6e320.firebaseapp.com
Report: https://builder-dot-lighthouse-ci.appspot.com/report.1507893961779.html
Category Score Progressive Web App 100 Performance 65 Accessibility 100 Best Practices 85 Tested with Lighthouse version: 2.3.0
Updated at #1071 (comment)
@abdonrd something looks wrong there... From the results, that looks like an unbundled build. There's definitely a penalty for unbundled in 2.0 because the library is so much more granular. Can you check your build and see if it's getting bundled properly? Could be a CLI issue...
Oops! I don't understand what happened.
Updated Polymer Starter Kit v3.2.0 hosted in Firebase. Preset: es5-bundled.
Lighthouse Report
Results for: https://psk-demo-6e320.firebaseapp.com
Report: https://builder-dot-lighthouse-ci.appspot.com/report.1507914790239.html
Category Score Progressive Web App 100 Performance 95 Accessibility 100 Best Practices 92 Tested with Lighthouse version: 2.3.0
We can improve the best practices with Polymer.setPassiveTouchGestures(true), right?
Reference: https://github.com/Polymer/polymer/releases/tag/v2.1.0
@abdonrd that seems like a good change to me
@robdodson & @keanulee: we only need to add this, right?
Polymer.setPassiveTouchGestures(true);And the right place should be in the index.html, after line 75, right?
Or in the src/my-app.html before line 119?
It would need to be after Polymer.setPassiveTouchGestures is defined, so my-app.html.
Now, with the last PR merged, we have better results: #1075 (comment).
@robdodson @keanulee and I guess we could improve the performance section a bit more, what do you think?
