Optimize Website Design (18): pre-load content

Preface

The optimization of website design is a big topic. There are some general principles and some suggestions for different development platforms. This research has never been stopped, and I have shared this topic on different occasions.

As a general principle, Yahoo's team of engineers once provided 35 best practices. For this list, seeBest practices for speeding up your web siteHttp://developer.yahoo.com/performance/rules.html, at the same time, they also integrated a corresponding test tool yslow http://developer.yahoo.com/yslow/

I strongly recommend that all website developers learn these best practices and apply them based on their actual projects. In the next period of time, I will combine the ASP. NET development platform and use a seriesArticleTo help you better understand and use these principles.

Preparations

Prepare the following development environment and tools to follow me for subsequent learning.

1. Google Chrome or Firefox, and install the yslow extension component. Please note that this component is provided by Yahoo, but there is no version for IE currently.
   1. Https://chrome.google.com/webstore/detail/yslow/ninejjcohidippngpapiilnmkgllmakh
   2. Https://addons.mozilla.org/en-US/firefox/addon/yslow/
   3. You should have some knowledge about the developer tools of these browsers. You can call up this tool by pressing F12.
2. VISAUL studio 2010 SP1 or later, Visual Studio 2012 is recommended
   1. Http://www.microsoft.com/visualstudio/eng/downloads
3. You need to have a good understanding of the basic development process and core technologies of ASP. NET. This series of articles is difficult to popularize basic knowledge.

Topics to be discussed in this article

This article I will discuss with you 16th principles: preload components (pre-loaded content)

In my previous article (optimize Website Design (17th): latency or loading content on demand), I talked about how to design latency or on-demand loading policies (for scripts, style sheets, images) to quickly load pages. It seems that the principles discussed in this article are contrary to the previous one, but they are not. They do not conflict and are used to achieve different goals. As long as you understand this principle, it is actually relatively simple to do.

ActuallyPre-LoadSuch a policy is used in many places. For example, a typical database access scenario involves a so-called "pre-read" behavior. I can take SQL Server as an example to explain what it is called "read ahead", and then compare it to webpage loading. I believe it is easy for everyone to understand.

To improve data reading efficiency, SQL Server tries to read part of the data to the cache when compiling the query statement for the first time and caching the execution plan, if the query statement really needs to be executed, because some data has been cached, the total amount of data read will naturally be less, which can improve the performance.

For more information about read ahead, see the documentation here: http://msdn.microsoft.com/en-us/library/ms191475 (V = SQL .105). aspx

The following is some interesting information that I can see from execution statistics when executing a query.

Okay. Let's go back to today's topic. Why do we need to preload the content? Imagine the use of search engines:

1. We usually log on to the search engine homepage first.
2. The home page of the search engine is usually relatively simple (Google has created such a design style, and the entire page has only one search box)
3. Therefore, homepage loading should be faster (because there are few items ). In addition, from the user's entry to the home page, to entering keywords for query, there will be some time, during which the browser is actually relatively idle.
4. When we enter a keyword in the search box, it will be transferred to the result page.
5. The content on the result page is usually relatively large. If all the content is loaded only when the result page is displayed, it may be slow.

In this case, can we add content (such as scripts, images, and styles) to the results page in some way when a user requests the homepage, load them in advance. In this way, when the user really needs to display the result page, it does not need to be loaded because the cache is already available.

So, do you know how to do it?

 

There is another practice that may be related to this principle. We know that ASP. NET websites usually load slowly for the first time because they need to be compiled. To optimize the loading speed of these websites, we have a method called "push". Simply put, we simulate users to request each page in advance, so that server compilation can happen as early as possible, in this way, you do not need to compile it again.

If you use Sharepoint, you can download the following script.

Http://gallery.technet.microsoft.com/office/SharePoint-2007-2010-or-d1884b4b

In fact, the above script can be modified. At least this idea is worth learning.

 

If you are using IIS 7.5, you can install the following components (Application initialization module for IIS 7.5To improve the performance of the website when it is accessed for the first time.

Http://www.iis.net/downloads/microsoft/application-initialization