Javascript 如何使用AddThis小部件提高页面加载速度？

我在facebook、twitter等网站上使用了这段代码，但其中有一个脚本使得页面加载速度非常慢。你能帮我解决这个问题吗？整个代码如下

<script type="text/javascript" 
    src="http://s7.addthis.com/js/250/addthis_widget.js"></script>

var addthis_config={
“数据\轨道\地址栏”：真
};

一件显而易见的事情是将javascript移动到页面底部，就在

之前，这样其他所有内容都可以在它之前加载。

除了如Mudshark所说将所有内容移动到页面底部之外，您还可以使用async addthis版本：

函数initAddThis（）{
addthis.init（）
}
//加载DOM后。。。
initAddThis（）；

解决方案之一是使用延迟JavaScript加载模式添加此库

有几个不错的JavaScript库可以帮助您解决这个问题。我个人主要使用（或单独使用）

你们可以在文章中阅读更多关于这个问题和改进的内容

顺便说一句，在我过去的项目中，通过使用延迟JavaScript加载模式，我能够将页面负载平均提高35%左右。我希望这会有所帮助。

将

async=“async”

属性添加到您的

脚本

标记中

  <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#async=1"></script> 

 function initAddThis(){
      addthis.init()
 }
 // After the DOM has loaded...
 initAddThis();

---

有几件事需要注意：

• 您确实不需要立即加载addthis，您可以在页面呈现过程中相对较晚地加载它
• addthis.js文件很大，目前约118kb，最小化并压缩（原文如此！）
• 由于它的大小，浏览器编译和处理它总是需要相对较长的时间，尤其是在移动设备上

使用<代码>异步属性在Script TAG中可能有所帮助，但是浏览器在看到属性时主要考虑网络资源。浏览器没有考虑脚本对CPU使用、页面呈现树等的影响（在浏览器中，他们无法确定）。例如，需要较长时间执行的脚本可能会阻止第一帧或其他重要的早期绘制的渲染。即使我们忽略获取addthis.js文件所需的网络资源（连接槽、带宽等），脚本仍可能对页面加载过程产生严重影响

请注意，虽然

async

属性提示浏览器可以异步加载资源，但它没有说明最终检索时脚本的执行情况。浏览器中的JS大多是单线程的，一旦浏览器开始处理.JS文件，它就无法退出，必须让它完成运行

在我的计算机上，在Chrome中评估脚本需要约130-140毫秒，它会阻止

ParseHTML

事件那么长时间。在功能较弱的移动设备上，它可能很容易跳到500毫秒

因为addthis太大了，所以最好给浏览器一点帮助，并推迟.js文件的获取，直到显示页面中其他更重要的组件。您应该为此任务使用专用的.js延迟库，以确保在

DOMContentLoaded

事件之后以及在处理其他重要资源之后处理该任务。我个人使用Lab.js来实现这一点，因为它很小，而且工作做得很好

---

还请注意，存在可以添加到

script

标记的

defer

属性，但是，规范明确指出，在事件发生之前，必须处理带有

延迟
标记的脚本，因此这里没有赢家。
您应该要求他们加快速度：）一个解决方案是异步加载它们一个明显的做法是将javascript移到页面底部第页，就在
之前。哦，我想你的意思是增加，而不是减少；-）正如你所说，我将脚本移到了页面底部，但没有用嘿，太好了-我刚刚找到了他们的选择退出页面：）尝试安装Chrome或使用Firefox和firebug。然后查看hte网络标签，看看是什么花了这么长时间才让你受第三方脚本的摆布——加载的速度有多慢，你无法控制。除了@WoLph建议使用异步之外，您可以做的事情不多了。
  <script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#async=1"></script> 

 function initAddThis(){
      addthis.init()
 }
 // After the DOM has loaded...
 initAddThis();

<script type="text/javascript" 
    src="//s7.addthis.com/js/300/addthis_widget.js#pubid=ra-4dfeea6f5bf22ac6" async="async">
</script>