简体   繁体   English

删除渲染阻止Javascript

[英]Remove Render Blocking Javascript

I tried Google PageSpeed Insights to check how much my website speed does well! 我尝试使用Google PageSpeed Insights检查我的网站速度有多好! But it shows an error in mobile version. 但它在移动版本中显示错误。 Google suggested me to remove render blocking javascript to make my site better looks in mobile device. Google建议我删除阻止渲染的javascript,以使我的网站在移动设备上看起来更好。 I've written bellow what exactly they said to me. 我已经在下面写下他们到底对我说了什么。

Your page has 1 blocking script resources and 3 blocking CSS resources. 您的页面有1个阻止脚本资源和3个阻止CSS资源。 This causes a delay in rendering your page. 这会导致页面渲染延迟。

None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. 如果不等待以下资源加载,则无法呈现页面上的首屏内容。 Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML. 尝试延迟或异步加载阻塞资源,或直接在HTML中内联这些资源的关键部分。 Remove render-blocking JavaScript: 删除阻止渲染的JavaScript:

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

Optimize CSS Delivery of the following: 优化以下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 

If you've written your page to be dependent on using jquery on load, removing it would mean you'd have to re-write a lot of your code, to save, perhaps 10 milliseconds in load time? 如果您编写的页面依赖于在加载时使用jquery,则删除它意味着您将不得不重新编写大量代码,以节省大约10毫秒的加载时间?

Open your browser's debugger, look at the NETWORK tab and reload the page. 打开浏览器的调试器,查看“网络”选项卡,然后重新加载页面。 You should be able to decide whether this suggested optimization is worth it or not (I'm suggesting it is not). 您应该能够决定建议的优化是否值得(我建议这样做不值得)。

I was having a similar issue with Javascript. 我在使用Javascript时遇到了类似的问题。 Make sure that in your code after your source your java that you put a type="text/js". 确保在源Java之后的代码中放置type =“ text / js”。 Like this: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/js"></script> 像这样: <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/js"></script>

Otherwise you need to go into your server and make adjustments to your htcaccess file. 否则,您需要进入服务器并对htcaccess文件进行调整。

Heloo Nazmul, may be you should to edit your question to "How to Remove default JS and CSS that make Render Blocking Javascript in Blogger?" Heloo Nazmul,也许您应该将问题编辑为“如何删除在Blogger中使用Render Blocking Javascript的默认JS和CSS?” may be so long but I think your problem is it. 可能会很长,但我认为您的问题就是这样。 Follow my step with : 按照我的步骤:

  1. change <head> to &lt;head&gt; <head>更改为&lt;head&gt;
  2. If your Internet Service Provider give some bloking JS and CSS add <!-- </head> --> before </head> 如果您的Internet服务提供商提供了一些笨拙的JS和CSS,请在</head>之前添加<!-- </head> --> </head>
  3. Change </head> to &lt;!--<head/>--&gt; </head>更改为&lt;!--<head/>--&gt;
  4. add <!-- </body></html> --> before </body></html> <!-- </body></html> -->之前添加<!-- </body></html> --> </body></html>

It is about DOM get work, I will give you example my blank blogger template if you still headache. 关于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>

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM