如何将未使用的 CSS/JS（不仅仅是清除）提取到单独的文件中？
How to extract unused CSS/JS (not just purge) into a separate file?
我的目标是消除网站上的渲染阻塞 CSS 和 JS。
Google 建议通过覆盖率识别使用的 CSS/JS，并将该代码从渲染阻塞 URL 移动到 HTML 页面中的内联脚本标记.当页面加载时，它将具有处理页面核心功能所需的内容。
例如核心 CSS:
<style type="text/css"></style>
然后 CSS 的其余部分可以通过预加载异步加载。
<link rel="preload" href="non-core-styles.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="non-core-styles.css"></noscript>
我遇到过 Purgecss 可以删除未使用的 css。
purgecss --css bootstrap-grid.min.css --content index.html --out dist/
但我更愿意提取未使用的 CSS 以便如上所述通过预加载异步加载它们以避免网站本身出现任何问题。
如何使用 Purgecss 或任何其他工具实现这一点？
javascript也是如此。内核可以这样加载：
<script src="app.js"></script>
虽然非关键部分可以像这样异步加载：
<script src="app.js" async></script>
但是有没有工具可以从我的网站中提取未使用的 JS？
谢谢
查看 https://github.com/pocketjoso/penthouse 以提取页面的 'critical' CSS，然后将其放入您的 <style type="text/css"></style> 标记中。
然后我建议通过 link 标签将 CSS 的 all 包含在 CSS 文件中。这意味着它在每个页面上都是相同的并且可以被浏览器缓存。
我的目标是消除网站上的渲染阻塞 CSS 和 JS。
Google 建议通过覆盖率识别使用的 CSS/JS，并将该代码从渲染阻塞 URL 移动到 HTML 页面中的内联脚本标记.当页面加载时，它将具有处理页面核心功能所需的内容。
例如核心 CSS:
<style type="text/css"></style>
然后 CSS 的其余部分可以通过预加载异步加载。
<link rel="preload" href="non-core-styles.css" as="style" onload="this.onload=null;this.rel='stylesheet'">
<noscript><link rel="stylesheet" href="non-core-styles.css"></noscript>
我遇到过 Purgecss 可以删除未使用的 css。
purgecss --css bootstrap-grid.min.css --content index.html --out dist/
但我更愿意提取未使用的 CSS 以便如上所述通过预加载异步加载它们以避免网站本身出现任何问题。
如何使用 Purgecss 或任何其他工具实现这一点？
javascript也是如此。内核可以这样加载：
<script src="app.js"></script>
虽然非关键部分可以像这样异步加载：
<script src="app.js" async></script>
但是有没有工具可以从我的网站中提取未使用的 JS？
谢谢
查看 https://github.com/pocketjoso/penthouse 以提取页面的 'critical' CSS，然后将其放入您的 <style type="text/css"></style> 标记中。
然后我建议通过 link 标签将 CSS 的 all 包含在 CSS 文件中。这意味着它在每个页面上都是相同的并且可以被浏览器缓存。