简体   繁体   English

google pageSpeed Insights,javascript IS折叠在WORDPRESS下方

[英]google pageSpeed Insights, javascript IS loaded below the fold WORDPRESS

I'm a WordPress user with lots of scripts and styles that are render-blocking. 我是一个WordPress用户,具有很多阻止渲染的脚本和样式。

Google's PageSpeed Insights is telling me that I have a ton of scripts above the fold, but when I look in my console they are being loaded right above the /body tag. Google的PageSpeed Insights告诉我,我有很多脚本,但是当我在控制台中查看时,它们正被加载在/ body标签上方。

For example, the last script loaded above the closing body tag looks like this: 例如,最后一个加载在体标签上的脚本如下所示:

  <script type="text/javascript" src="https://mysite.com/wp-includes/js/comment-reply.min.js?ver=3.9.2"></script>
  <div id="wpadminbar" class="" role="navigation"></div>
  <div id="tiptip_holder" style="max-width:290px;"></div>
  <iframe id="rufous-sandbox" scrolling="no" frameborder="0" allowtransparency="true" style="display: none;"></iframe>
  <div id="window-resizer-tooltip" style="display: none;"></div>
</body>

How is this last script considered above the fold? 如何看待最后一个脚本?

You may want to use a javaScript function to load your external javaScript code. 您可能需要使用javaScript函数来加载外部javaScript代码。
Then use 然后使用

window.onload = function;

where "fucntion is the name of your load function. 其中“ fucntion是加载函数的名称。

Of course check you <head> for other js. 当然,请检查<head>以获取其他js。

You should generate an HAR HTTP Archive for the page load. 您应该为页面加载生成一个HAR HTTP存档。 You could use Google Chrome's Timeline recorder. 您可以使用Google Chrome浏览器的时间轴记录器。 There is an online guide to using the Timeline reorder but there is a fairly steep learning curve. 有一个使用时间轴重新排序的在线指南,但是学习曲线相当陡峭。 It will give you every detail you need and a lot more. 它会为您提供所需的每一个细节以及更多其他信息。

How to record: Link to How to Record 如何录制: 链接到如何录制

Easier, but with less detail, is using webpagetest.org to generate the HAR for you. 使用webpagetest.org比较容易,但细节较少,可以为您生成HAR。 After you get the Page Speed test summary, in the upper right hand corner there is a link labeled "Export HTTP Archive (.har)". 在获得Page Speed测试摘要之后,在右上角有一个标记为“导出HTTP存档(.har)”的链接。

Then use PHP to analyze the HAR. 然后使用PHP分析HAR。 This is rather crude, but it is quick and easy. 这是相当粗糙的,但是它又快速又容易。

$data = @file_get_contents($path);
$json = json_decode($data,true);
echo '<pre>
var_export($json );
echo '</pre>

What you want to observe is when your .js loads with respect to other content start load times. 您要观察的是.js相对于其他内容的开始加载时间。

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

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