删除渲染阻止Javascript

时间:2014-06-03 21:37:43

标签: javascript

我尝试使用Google PageSpeed Insights检查我的网站速度有多好!但它显示移动版本中的错误。谷歌建议我删除渲染阻止javascript,以使我的网站在移动设备中更好看。我已经写下了他们对我说的具体内容。

  

您的页面有1个阻止脚本资源和3个阻止CSS   资源。这会导致呈现页面的延迟。

     

您网页上的所有内容都无法呈现   无需等待以下资源加载。试着推迟或   异步加载阻塞资源,或内联关键   这些资源的一部分直接在HTML中。去掉   渲染阻止JavaScript:

https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js
     

优化以下内容的CSS传递:

http://fonts.googleapis.com/…%3A300%2C400%7CRaleway%3A400%2C500%2C900
https://www.blogger.com/…/3728782508-widget_css_mobile_bundle.css
https://www.blogger.com/…&zx=88195f1c-da8c-4c99-bb3e-609abb88c4fa

3 个答案:

答案 0 :(得分:1)

如果您已经将页面编写为依赖于在加载时使用jquery,那么删除它将意味着您必须重新编写大量代码,以节省,加载时间可能是10毫秒?

打开浏览器的调试器,查看NETWORK选项卡并重新加载页面。你应该能够决定这个建议的优化是否值得(我建议不是)。

答案 1 :(得分:0)

我遇到了与Javascript类似的问题。确保在你的源代码之后的代码中你输入了一个类型=&#34; text / js&#34;。像这样: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/js"></script>

否则,您需要进入服务器并调整htcaccess文件。

答案 2 :(得分:0)

Heloo Nazmul,您可能应该将问题编辑为&#34;如何删除在Blogger中使渲染阻止Javascript的默认JS和CSS?&#34;可能是这么久但我认为你的问题是它。 按照我的步骤:

  1. <head>更改为&lt;head&gt;
  2. 如果您的互联网服务提供商在<!-- </head> -->
  3. 之前添加了一些blo和JS和CSS </head>
  4. </head>更改为&lt;!--<head/>--&gt;
  5. <!-- </body></html> -->
  6. 之前添加</body></html>

    关于DOM的工作,如果你仍然头痛,我会举例说明我的空白博客模板。

    <?xml version="1.0" encoding="UTF-8" ?>
    <!DOCTYPE html>
    <html xmlns='http://www.w3.org/1999/xhtml' xmlns:b='http://www.google.com/2005/gml/b' xmlns:data='http://www.google.com/2005/gml/data' xmlns:expr='http://www.google.com/2005/gml/expr'>
        &lt;head&gt;
            <meta charset='utf-8'/>
            <style/>
            <b:skin><![CDATA[]]></b:skin>
        <!-- </head> -->
        &lt;!--<head/>--&gt;
        <body>
            <b:section class='header' id='header' showaddelement='yes'/>
            <a href="https://klikada.com"><h1 style="color:blue;font-family: monospace">klikada.com</h1></a>
            <b:section class='main' id='main' showaddelement='yes'/>
            <b:section class='footer' id='footer' showaddelement='yes'/>
        <!-- </body></html> -->  
        <style>a:link{text-decoration:none;}a:visited{text-decoration:none;}a:hover{text-decoration:none;}a:active{text-decoration:underline;}</style>
    </body>
    </html>