谷歌开源 SEO 工具 Lighthouse：前端性能分析神器

hwyzw

    SEO Zen 今天要跟大家分享的是  开源的 SEO 工具：说它是 SEO 工具并不是很准确。它实际上是一个前端性能分析工具。有两种使用方式，一种是插件形式，另一种是命令行形式。本文主要以插件的形式来介绍。如果你想体验一下命令行，就去官网看看介绍。

    首先我们来一张SEO Zen的审核报告截图（国外网络测试）：

    可以看到性能分数只有86，如果一个月前我没记错的话，应该是93。有一个不合格的项目，速度指数，达到了10秒。这个问题主要是因为测试网络在国外，服务器在国内，服务器带宽速度比较低，所以我使用国内外网络做了速度测试。以下是本地测试的结果：

    一开始我以为是服务器优化不好的原因，其实不然。这个问题很容易解决。要么换一台更好、带宽更大的服务器，要么加个CDN。添加CDN是一个更好的解决方案，但现在没有必要。因为访问量不是很大，而且谷歌的收录基本都是当天，百度最近没有关注，因为不是SEO Zen网站的问题导致收录不理想，所以在这时候不如“敌不动，我不动”，以下是用来优化SEO禅宗网站的。

    安装

    访问扩展界面并安装插件。安装完成后，你会在右上角看到一个小灯塔图标。进入您要查看的网页，点击 图标，然后点击右上角的设置图标，根据您的需要勾选设置：

    四大指标

    作为SEOer，在使用网站性能分析时，主要看前四个指标：、Best、SEO，还有一个在国内基本不用，主要讲网站的性能，比如打开率速度。交互时间点、JS代码阻塞时间等

    SEO优化实例

    向下滚动查看报告，可以看到红色提示：

    这意味着没有合适的缓存策略。这里SEO Zen会添加一个-缓存策略并将以下代码插入到.网站根目录下的文件：

<p style='margin-bottom:15px;color:#555555;font-size:15px;line-height:200%;text-indent:2em;'>    <pre class="EnlighterJSRAW" data-enlighter-language="generic"># 开始Cache-Control Headers
<ifModule mod_headers.c>
<filesMatch "\.(ico|jpe?g|png|gif|swf)$">
Header set Cache-Control "max-age=2592000, public"
</filesMatch>
<filesMatch "\.(css)$">
Header set Cache-Control "max-age=604800, public"
</filesMatch>
<filesMatch "\.(js)$">
Header set Cache-Control "max-age=604800, private"
</filesMatch>
<filesMatch "\.(x?html?|php)$">
Header set Cache-Control "max-age=600, private, must-revalidate"
</filesMatch>
</ifModule>
# 结束Cache-Control Headers</pre></p>
    重启服务器并再次检查：

    本文就先介绍到这里。具体用途大家可以先自己研究一下。 SEO Zen会继续写文章来介绍。工具是用来发现问题的，解决问题还是需要自己动手。