Я пытаюсь разработать простой PWA, на самом деле я уже это сделал, но после того, как я развернул его на Netlify и запустил Lighthouse, он довольно плохо работал на Performance и Best Practices, несмотря на то, что это действительно простое приложение для спа-приложений с 4 страницами. Затем я снова начал с чистого листа:
ng new AngularApp --enable-ivy
cd AngularApp
ng add @angular/pwa
ng build --prod --aot --vendor-chunk --common-chunk --delete-output-path --buildOptimizer
http-server-spa dist/AngularApp index.html 8080
- это Angular, а Lighthouse - оба продукта Google. Я ожидал почти идеального результата в новом приложении без функций, вместо этого я получил
- 95 Специальные возможности
- 86 Лучшие практики
- 91 SEO
- 3/3 3/3 5/7 PWA
Лучшие практики потеряли несколько баллов, я думаю, потому что я не использовал https для тестирования рабочей сборки, это нормально, но производительность имела Fist Contentful Paint, First значимую краску, First CPU Idle, все желтые занимали более 3 секунд, и MaxПотенциальная задержка первого входа красная при 390 мс. Как я должен устранить эти узкие места и, в особенности, сохранить это значение на низком уровне, когда я добавлю больше функций в свое приложение?