JavaScript performance Optimization (2)

1. Image loading effect. Browsers choose different rendering algorithms based on different images.

1.1 wavelet algorithm: First blur and then clear. This loading method is faster and improves rendering performance. The disadvantage is that more memory is consumed. If it is a large size picture, you can use this method.

Export images from PSD, stored as Web format, JPEG tick continuous, PNG tick interleaved, so the exported image is from blur to clear.

1.2 Discrete cosine transform: row-by-line loading shows clear images

2. Common Video Optimization methods

2.1 UI Requirements for custom players (slightly)

2.2 Video is loaded first, shortening the time from the user entering the page to the first frame of the video playback.

2.2.1 Regardless of where the initialization file is located, the browser will always default to loading the multimedia file resource last. So, cheat the browser and load the multimedia resource as a style sheet:

<ref= "stylesheet"  type= "text/css"  href= " xxx.swf ">

3. Leveraging front-end caching technology

3.1 Sessionstorage-as the label turns off auto-recycle (empties the cache), you cannot interact across pages.

3.2 UserData-storage limits are too small, each file is less than 128kb, and a total of 1024kb files can be saved under a domain name. At restricted sites, a single file 64kb, a total of 640kb.

3.3 Cookies-good compatibility. Size is limited, each time a request is sent, the request header will be sent with a cookie.

3.4 OpenDatabase-is the complete database.

3.5 Localstorage-There is no time limit for stored data.

JavaScript performance Optimization (2)