HTML and CSS Reference
In-Depth Information
With this image, you see a large spikes in the beginning of the request because the browser needs to populate all
the DOM nodes and parse through the scripts and styles as quickly as possible. Also, at the beginning of the content
request, you can see that close to 70MB of memory is used just to render the page to a user.
■
these measurements are dependent on system capabilities and network connection speeds. please do your
own code optimization.
Note
Another important tool to use in your optimization techniques is the use of the Audit tab in your browser's
web inspector. The Audit feature allows developers to run a number of checks and balances against the page you're
requesting. After evaluating the page contents, ads and all, the web inspector will offer tips on how to improve
performance and speed up page rendering. It might recommend that you to compress your text-based files or even
remove style declarations on elements that aren't being rendered. Figure
10-6
showcases an audit on my domain,
Figure 10-6.
The browser's Audits tool
■
Note
i'm fully aware that my domain needs optimization, which is why it's a perfect test case.
Optimization analysis of your web content applies as much to mobile as it does to desktop and other formats
using network connections. Get used to inspecting and tearing apart pages and advertisements to attempt to get the
smallest digital footprint out of your content. Again, keep in mind that no one goes online to look at ads, unless you're
the one building them. The same can be said about watching television for the commercials. Advertising is meant
to be impactful, attention grabbing, and engaging, not something that will tax your computer or device just because
some poorly written ad code is eating up system resources. Keep this in mind at all times and make the Web a better
experience for everyone. Debugging and optimization are time-consuming processes that you will master only by
doing them often and repeatedly. This chapter won't make you an expert, but it will give you the edge and will allow
