根据不同的业务需求，开发者可以将JS中首屏的关键代码拆分出来，这样可以提前加载执行首屏中必需的少量JS代码，从而缩短页面的加载时间，其余的可以按需加载或者置后加载，同时建议开发者将JS优先放在首屏渲染完成之后，放在body闭标签前面。

（1）优先使用异步JS资源

默认情况下，JS资源会阻塞解析，强制等待CSSOM并暂停DOM的构建，继而大大延迟首屏渲染的时间。异步JS资源则不会阻塞文档解析器，如果脚本可以使用defer/async 属性，也就意味着它并非是首屏渲染所必需的，可以考虑在首屏渲染后异步加载脚本。

（2）延迟解析加载JS

为了最大限度减少内核渲染网页的工作量，建议开发者延迟所有非必需的、对构建首屏渲染无关紧要的JS脚本，将JS优先放在body闭标签处。

（3）避免长时间运行的JS

运行时间长的JS会阻塞构建 DOM、CSSOM以及网页的渲染，所以任何对首屏渲染无关紧要的初始化逻辑和功能都应延后执行。如果需要运行较长的初始化序列，请考虑将它们拆分为若干个阶段，以便浏览内核可以间隔处理其它的渲染任务。

（1）优化CSS的使用方式

CSS是构建渲染树的必备元素，首次构建网页时，确保将任何非必需的CSS资源都标记为非关键资源（比如print），并应确保尽可能减少关键CSS子资源的数量。

（2）关键CSS放在文档head标签内

尽早在HTML文档内指定所有必需的关键CSS资源，以便浏览内核尽早发现link标记并发出CSS请求下载。

（3）避免使用CSS import指令

一个样式表可以使用CSS import指令从另一个样式表文件导入规则。不过应避免使用这些指令，因为它们会在关键路径中增加往返次数从而影响首屏渲染性能。

优化时可以考虑通过简化编码来优化主文档大小，同时可以采用chunk编码，服务器分chunk输出，以及通过GZIP来压缩主文档资源。