Home > Web Front-end > HTML Tutorial > Remember to optimize the page and use the caching mechanism_html/css_WEB-ITnose

Remember to optimize the page and use the caching mechanism_html/css_WEB-ITnose

WBOY
Release: 2016-06-24 11:45:36
Original
1216 people have browsed it

1. Using the caching mechanism of html5

1. First enter the rule code: m.manifest

CACHE MANIFEST# 2015-04-24 14:20#直接缓存的文件CACHE:/templates/specialty/css/style.css/templates/specialty/js/jquery.js/templates/specialty/js/index.js/templates/specialty/js/custom.js/templates/specialty/js/97zzw.jsNETWORK:*
Copy after login

CACHE: required Cached files

NETWORK: Files that need to be loaded from the network

Of course there are other parameters, but I only test these; Note: Do not cache those that change frequently. If they are already cached, you can pass Modify the manifest file and let the browser recreate the cache.

2. Add a rule file in

<!DOCTYPE html><html manifest="m.manifest"><head><meta charset="utf-8"><meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /><meta name="viewport" content="width=device-width, initial-scale=1.0">
Copy after login

3.manifest file needs to be configured The correct MIME-type, which is "text/cache-manifest". Must be configured on the web server.

If you are using Apache, you can add in .htaccess:

AddType text/cache-manifest manifest

After completing the above 3 steps, you can now test

Under chrome:

Caching successful! Continue testing????>

Status code 304, using cache.

Under Firefox:

Summary: When defining rules, be careful to cache data that is not constantly updated, and do not miss writing NETWORK rules; the speed is still significantly improved. .

2. Use css sprite to reduce http requests.

3. Compress the js code and only quote the js required by the current page.

4. Use asynchronous loading of images and content.

5. Enable server gzip compression.

6. Compress css.

7. Compressed html code

After the above optimization, I used Baidu Webmaster Test again and the score has been greatly improved.

The above is the current optimization, and the php function will be optimized in the future.

source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template