渲染阻塞react.js和pageSpeed/page rank

Jam*_*mer 8 javascript sync reactjs

在React.js的教程中,它表明它的javascript文件需要在<head>不允许页面呈现的情况下才能完成加载.

从这个快速测试看来,任何需要react.js的网站都不会对google的pageSpeed有好处,因为它会抛出这个问题"消除渲染阻止JavaScript和CSS 的首要内容"

我的问题是:

  1. 这实际上会影响页面速度
  2. 这个问题是否意味着谷歌网页排名也将受到影响

Pav*_*ati 9

要扩展@Bojangels评论:最好在</body>结束标记之前的脚本标记中加载React,如下所示:

<html>
    <head>
        <title>This is my app!</title>
    </head>
    <body>
        <!-- Your body content --> 
        <script src="https://fb.me/react-0.13.3.min.js"></script> 
    </body>
</html>
Run Code Online (Sandbox Code Playgroud)

将脚本放在最后将允许在到达并react-0.13.3.min.js加载脚本标记之前呈现其余的html和css规则.

同样如上所述,您可以向脚本标记添加defer属性,如下所示:

<script src="https://fb.me/react-0.13.3.min.js" defer="true"></script> 
Run Code Online (Sandbox Code Playgroud)

通过添加defer属性,您将完成以下操作(source:mdn):

此布尔属性设置为向浏览器指示在解析文档后要执行脚本.

至于你关于页面加载速度是否影响谷歌搜索排名的第二个问题,Moz(一家SEO公司)写了一篇关于页面速度和排名的帖子并得出结论:

我们的数据显示"页面加载时间"(文档完整或完全呈现)与Google搜索结果页面上的排名之间没有相关性.