Performance for a content-driven web app frontend
Stay organized with collections
Save and categorize content based on your preferences.
Performance refers to your web application's efficiency, speed, and
responsiveness. Slow load times and inactivity lead to high bounce rates and few
conversions. Therefore, content-driven application development must prioritize
performance to make sure that users can interact with the application smoothly
and efficiently. A web application's speed and responsiveness are valued across
industries; news applications are expected to provide articles as fast as
possible, ecommerce applications must load products quickly to keep potential
customers interested, and documentation or blogs demand quick loading for clear
navigation and reader satisfaction.
Tools for assessing the performance of content-driven applications include:
- PageSpeed Insights (PSI): Run by
web.dev is a tool to check the experience of mobile and desktop and provide
suggestions on what to improve. This is powered by the Chrome User
Experience Report (CrUX) dataset and checks for multiple types of
experiences.
- Lighthouse:
Can be found in Google Chrome Developer
Tools and has a
browser
extension
to measure many aspects of the web application such as performance,
accessibility, best practices, SEO and PWA audits.
The Core Web Vitals tool includes the
following aspects, among others:
Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies. Java is a registered trademark of Oracle and/or its affiliates.
Last updated 2024-07-10 UTC.
[[["Easy to understand","easyToUnderstand","thumb-up"],["Solved my problem","solvedMyProblem","thumb-up"],["Other","otherUp","thumb-up"]],[["Missing the information I need","missingTheInformationINeed","thumb-down"],["Too complicated / too many steps","tooComplicatedTooManySteps","thumb-down"],["Out of date","outOfDate","thumb-down"],["Samples / code issue","samplesCodeIssue","thumb-down"],["Other","otherDown","thumb-down"]],["Last updated 2024-07-10 UTC."],[[["\u003cp\u003eWeb application performance, encompassing speed and responsiveness, is crucial for user satisfaction and achieving business goals, as slow performance leads to high bounce rates and low conversions.\u003c/p\u003e\n"],["\u003cp\u003eContent-driven applications across various industries, including news, ecommerce, and documentation, require fast loading times for optimal user experience.\u003c/p\u003e\n"],["\u003cp\u003eTools like PageSpeed Insights and Lighthouse can help assess and improve web application performance by providing detailed analysis and suggestions.\u003c/p\u003e\n"],["\u003cp\u003eCore Web Vitals, including Largest Contentful Paint, First Input Delay, and Cumulative Layout Shift, are key metrics for measuring and optimizing loading performance, interactivity, and visual stability.\u003c/p\u003e\n"]]],["Web application performance, including speed and responsiveness, is crucial for user engagement and conversions. Key metrics include Largest Contentful Paint (LCP) under 2.5 seconds, First Input Delay (FID) under 100 milliseconds, and Cumulative Layout Shift (CLS) under 0.1. Tools like PageSpeed Insights (PSI) and Lighthouse assess these metrics. PSI checks desktop and mobile user experiences, while Lighthouse, integrated into Chrome, evaluates performance, accessibility, best practices, SEO, and PWA compliance.\n"],null,["# Performance for a content-driven web app frontend\n\nPerformance refers to your web application's efficiency, speed, and\nresponsiveness. Slow load times and inactivity lead to high bounce rates and few\nconversions. Therefore, content-driven application development must prioritize\nperformance to make sure that users can interact with the application smoothly\nand efficiently. A web application's speed and responsiveness are valued across\nindustries; news applications are expected to provide articles as fast as\npossible, ecommerce applications must load products quickly to keep potential\ncustomers interested, and documentation or blogs demand quick loading for clear\nnavigation and reader satisfaction.\n\nTools for assessing the performance of content-driven applications include:\n\n- [PageSpeed Insights (PSI)](https://pagespeed.web.dev/): Run by web.dev is a tool to check the experience of mobile and desktop and provide suggestions on what to improve. This is powered by the Chrome User Experience Report (CrUX) dataset and checks for multiple types of experiences.\n- [Lighthouse](https://developer.chrome.com/en/docs/lighthouse/): Can be found in [Google Chrome Developer\n Tools](https://github.com/GoogleChrome/lighthouse) and has a [browser\n extension](https://chrome.google.com/webstore/detail/lighthouse/blipmdconlkpinefehnmjammfjpmpbjk) to measure many aspects of the web application such as performance, accessibility, best practices, SEO and PWA audits.\n\nThe [Core Web Vitals](https://web.dev/vitals/) tool includes the\nfollowing aspects, among others:\n\n- [Largest Contentful Paint (LCP)](https://web.dev/lcp/): measures loading performance. LCP should occur within 2.5 seconds of when the page first starts loading.\n- [First Input Delay (FID)](https://web.dev/fid/): measures interactivity. Pages should have a FID of 100 milliseconds or less.\n- [Cumulative Layout Shift (CLS)](https://web.dev/cls/): measures visual stability. Pages should maintain a CLS of 0.1. or less."]]
