Website performance optimization

Website performance optimization[email protected]
1.? Cache

2. Conditional get- default comes with
   • →if-modified-since:wed,22,2006,4:15pm
   • ←last-modified:
4. expires:wed,22,2006,4:15pm- need to set
   • Disadvantage: The server and the client's clock is required to be strictly synchronized, after expiration send a new come over
6. expires improvement Cache-control:max-age   - need to set
   requirements: HTTP1.1
   • Improvement: No longer requires clock synchronization like expires, just set the countdown in Max-age.
   • make expires like Cache-control : Max-age can use Apache's Mod _ expires plugin.
8. ETag set to Forbidden - need to set
   • Server unique identity hard to hit cache under distributed Cluster Server

Proxy Cache

• Cache the various versions of the response, such as compressed, uncompressed vary:accept-encoding,useragent
• Disable cache Vary:* or Cache-control:private

Problem:

• After the cache, you update the file, and the client also uses the cached old file. How to deal with this situation?

  A: When writing HTML, with the version number above, after the server updates the file, update the HTML reference file version number, so that the client's cache can not be hit, forcing the download of the updated file from the server.

2.?Other optimizations

2. Reducing HTTP requests: Using image flattening techniques, file merging
4. Use CDN: Automatically find the best network line for faster request response
6. CSS in head: Prevents Fouc (no flicker of style content)
   • Principle: Browsers render with DOM tree and style sheet (rending), style sheets at the bottom, causing re-rendering
8. Script on bottom: Prevent blocking parallel downloads
   • Principle: JavaScript will be able to use document.write to generate pages, such as two JS in the use of document.write () in parallel download and execution of the conflict occurs.
   • Alternate Method 1- sub-download: After setting the cookie, wait for the second time to download
   • Alternative Method 2-ajax injection Download
10. Do not use CSS expressions
    • Principle: The calculation of CSS expressions is too frequent, each mouse movement will produce thousands of expression calculation
12. Using external CSS and JavaScript
    • Principle: so that they can be cached
14. Use whitespace and confusion to streamline JavaScript
    • Compression: Remove whitespace, tab indentation, and other meaningless character requirements: JavaScript writing cannot omit ";", otherwise syntax error will occur
    • Confusion: replace short words with long words, so that the size of the file will be reduced, and is very bad for reading, the advantage is to prevent others to crack your code
16. Go to heavy JavaScript
    • If multi-person collaborative development, it is likely that a library cited two copies
18. Use gzip to compress transfers
20. avoid redirection
    tracking Technology Span data-line= "P" > - knowing where the user left your site
    • url parameter Assuming our site is www.yahoo.com url for www.yahoo.com/**http %3a//en.wikipedia.org/Our server puts back a 302 redirect and gets to the back URL address to know where the user went after leaving www.yahoo.com
    • blank img Tag-beacon Beacon <a> Single-machine trigger a function There is an empty GET request in the function, which has the URL parameter <a href= "www.wiki.com"  onclick= "result Beacon (this)"  >performance wiki</ A><script>var Beacon; function Resultbeacon (anchor) {beacon = new Image (); beacon.src= "www.yahoo.com/?" ++escape (Anchor.href)}</script>
22. Avoid excessive DNS lookups

3.?Advanced

2. Interface response lag caused by long-running threads
   • Multithreading with work threads or gear plugins
   • Use timers to run scripts or suspend scripts intermittently
4. The script is divided into two parts, initialization and non-initialization, the non-initialization part can delay loading
   • The defer property of the script tag
6. No blocking script
   • Ajax (XHR) injection Download eval or modify the SRC attribute of the script tag
8. Script Merge
   • This can reduce the number of HTTP requests
10. The efficiency of JavaScript execution
    • Two-point Search
    • Avoid using string + operations, using string array after join method
    • Using Event Delegation: Reduce duplicate code with event bubbling mechanism
12. Image optimization
    • Compression cropping reduces resolution

4.?Reference books

1. High Performance website Building guide-Steve souders commonly known as: Dog book
2. Advanced guidelines forHigh-performance website construction-Steve souders popularly known as: Lu Shi

5. Tool YSlow Picture Scrolling loading, progressive rendering chrome profle timeline using font icons and css--not overly dependent on pictures

From for notes (Wiz)

Website performance optimization