admin管理员组

文章数量:1531667

写在最前

默认情况下，要打开一个页面，浏览器必须下载、解析和处理所有的外部样式表，然后才能在用户屏幕上显示或呈现内容。这样就必须从网络下载每个外部样式表，这些额外的网络行程会大大增加用户在屏幕上看到任何内容之前必须等待的时间。
但是实际情况却是，一个比较大的样式表，往往关键css只占很小的一部分。 这篇文章就会介绍如何利用critical提取一个页面上的关键css以及推迟非关键css

  1. 首先要安装node.js ,这里就不说说明了 很简单

  2. 打开cmd命令， 输入命令 npm i -D critical 进行安装，安装完成以后，会在你目录 C:\Users\{UserName}\AppData\Roaming\npm\node_modules 创建一个critical文件夹。 {UserName}是你计算机的用户名

    AppData可能是隐藏的目录

  3. 在C:\Users\{UserName}\AppData\Roaming\npm\node_modules\critical目录下新建pcs.js文件，文件名自定义，文件内容如下：
    base是你的根目录
    src是你项目的html文件
    target下面的html是处理后的html文件，css是处理后css文件

    const critical =</

本文标签： 内联关键Criticalcss

版权声明：本文标题：利用critical提取关键内联css 内容由热心网友自发贡献，该文观点仅代表作者本人， 转载请联系作者并注明出处：https://m.elefans.com/xitong/1726269352a1063629.html， 本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容，一经查实，本站将立刻删除。