买专利卖专利找龙图腾，真高效！ 查专利查商标用IPTOP,全免费！专利年费监控用IP管家,真方便！

申请/专利权人：南京焦点领动云计算技术有限公司

摘要：本发明公开了一种提取网页首屏CSS样式的方法，其特征在于，包括步骤一，配置node服务端，步骤二：通过客户端发起提取CSS样式的请求，启动无界面浏览器并开启提取任务，等待无界面浏览器返回结果；步骤三：配置nodejs访问参数，调用收集方法获取目标页面中的所有CSS样式；步骤四：针对步骤三获取到的页面中所有CSS样式，使用postcss进行过滤；步骤五：分析首屏的CSS样式；步骤六：重新渲染首屏的CSS样式，达到在开发主体完成后的进行性能优化，能够使性能更进一步的提升；将主要的CSS内容提取，去除link与style标签减少http请求与doc内容，对页面内容多的网页性能提升有着明显提高的效果。

主权项：1.一种提取网页首屏CSS样式的方法，其特征在于，包括如下步骤：步骤一：配置node服务端，所述node服务端用于接收需要提取CSS样式的请求；步骤二：通过客户端发起提取CSS样式的请求，node服务端接收到请求后，启动无界面浏览器并开启提取任务，所述提取任务是指node服务端接受到来自客户端的请求后开始启动一个监听事件，所述监听事件用于获取页面首屏中使用到的CSS，等待无界面浏览器返回结果；步骤三：配置nodejs访问参数，根据客户端所携带的地址配置无界面浏览器的访问地址；开启无界面浏览器访问目标页面，等目标页面完全加载结束后调用收集方法获取目标页面中的所有CSS样式，所述收集方法包括：使用javascript获取link标签内容、style标签内容；当所述无界面浏览器为谷歌浏览器时，根据CDPSession进行通信，将提取的CSS样式传入提取方法中，用于生成页面首屏的CSS样式，所述提取方法包括setNetwork、setDom和setPage；步骤四：针对步骤三获取到的页面中所有CSS样式，使用postcss进行过滤；步骤五：根据步骤四获取到页面中所有CSS样式，根据无界面浏览器提供的首屏样式占比与设置的虚拟设备宽度，分析首屏的CSS样式，将首屏的CSS样式通过promise调用的形式返回给node服务端所开启的任务，关闭无界面浏览器进程，等待后续请求；所述首屏样式占比指首屏中的CSS样式的所占比例，根据无界面浏览器与ChromeDevToolProtocol之间的通信协议获取，所述分析首屏的CSS样式具体为：根据首屏样式占比与设置到虚拟设备宽度，对目标地址的全部样式进行遍历，根据最大宽度与最小宽度判断是否在首屏中有使用，如没有在首屏中使用则将其移除；步骤六：重新渲染首屏的CSS样式，具体为，将首屏的CSS样式放入document中，使用JavaScript对其他样式进行延迟加载。

全文数据：

权利要求：

百度查询： 南京焦点领动云计算技术有限公司 一种提取网页首屏CSS样式的方法