javascript - 如何使我的网页加载速度更快？

Question

假设浏览器缓存为空 - 如何仅通过应用 HTML/CSS/JavaScript 代码更改来加快网页加载速度？

意思是，不建议移动服务器、使用 CDN 等。只需更改代码以使其加载速度更快。

Answer 1

根据我的经验:

(1) 安装 Firefox 的 YSlow 和 Page Speed 扩展，并尽可能遵循他们的建议。

(2) 非常重要:为保存图像、JS 和 CSS 文件的目录配置HTTP 缓存。我只是把它们放在一个名为 static 的目录中，然后把这个 .htaccess 文件放在那里:

<IfModule mod_headers.c>
    Header set Cache-Control "max-age=29030400, public"
</IfModule>
<IfModule mod_expires.c>
    ExpiresActive On
    ExpiresDefault A29030400
    ExpiresByType image/x-icon A29030400
    ExpiresByType application/x-javascript A29030400
    ExpiresByType application/javascript A29030400
    ExpiresByType text/css A29030400
    ExpiresByType image/gif A29030400
    ExpiresByType image/png A29030400
    ExpiresByType image/jpeg A29030400
    ExpiresByType text/plain A29030400
    ExpiresByType application/x-shockwave-flash A29030400
    ExpiresByType video/x-flv A29030400
    ExpiresByType application/pdf A29030400
    ExpiresByType text/html A29030400
</IfModule>

(3) 从 HTML 文件中提取 CSS 代码并将其放入单独的 CSS 文件中。

(4) 将你的JS文件合并成一个文件。然后使用 JSMin 压缩此文件将很有用。

(5) 在 Apache 中为静态文本文件打开 gzip 压缩。如果您的 Apache 服务器上有 mod_deflate，请将其放入网站根目录中的 .htaccess 文件中:

<IfModule mod_headers.c>
    <FilesMatch "\\.(js|css|html|htm|php|xml)$">
        SetOutputFilter DEFLATE
    </FilesMatch>
 </IfModule>