Overview
Performance is a measurement of how well an application can perform given limited resources. A common measurement of the application performance is to measure the response time based on user's interactions and requests. A good performing application will be able to use the least amount of time to display and respond to the user, therefore providing a high level of user experience.
When performance declines, it could be due to the increase of data that requires processing, lack of processing memory, or non-optimal algorithms used for computer calculations. In order to deal with these issues, we first need to be able to measure the current situation correctly. Methodologies to measure includes but is not limited to, using developer tools to monitor network traffic, diagnostic tools, and embedding code that logs and record measurements.
If the response time for a given page or feature is considered to be slow, it can be due to an issue or problem in the application. These issues that cause the performance to degrade are known as bottlenecks. In order to improve performance, we will need to identify potential and existing bottlenecks and handle them accordingly.
Learning Objectives
It is important to correctly understand performance in applications in order to make improvements where necessary, and in turn provide users with a smooth, usable environment.
Even if there are no performance issues right after an application is released, performance can still degrade over time due to the increase in the number of users or increase in functionalities. To locate and identify issues early, we need to set targets for performance and constantly measure them.
It may not be possible to resolve an issue immediately if it's found to be very complex. At the same time, if too many issues pile up it may become harder to identify issues, so it's advisable to conduct frequent investigations even if they do not immediately improve the application.
First, learn how to measure and improve performance.
Learn from Here
Learn about improving performance on web pages. First, experience measuring and tuning performance to get a feel for what to do. For measurement, using the developer tools provided by Chrome is recommended. Learn from other articles and blogs too.
Improving Performance on Web Pages
Measure Performance on Web Pages Using Developer Tools
Preload Resources
Use CSS Sprites
Minimize the Size of HTML/CSS/JavaScript/Image Files
Utilize Gzip Compression and Browser Cache
Understand the Relationship between Screen Layout and Redrawing
Recommended Materials
Web performance - Learn web development | MDN
This article describes and explains performance from the standpoint of the client. Learn about what affects performance and how to improve it.
Web performance - Learn web development | MDN
Building websites requires HTML, CSS, and JavaScript. To build websites and applications people want to use, which attract and retain users, you need to create a good user experience. Part of good user experience is ensuring the content is quick to load and responsive to user interaction. This is known as web performance, and in this module you'll focus on the fundamentals of how to create performant websites.
developer.mozilla.org