网站速度和异步Javascript

异步

尽管我做了很多开发工作,但我并没有将自己归类为真正的开发人员。 我可以对页面上的内容进行编程和移动,并使之正常工作。 真正的开发人员了解如何开发代码,以便可以对其进行扩展,不占用大量资源,快速加载,稍后轻松进行修改并仍能正常工作。

营销人员所面临的难点是两者都有一个 非常快的网站 并且仍然结合了集成和社交元素,这些元素可能对网站加载的速度产生依赖性。 一个这样的例子是 社交按钮。 在Martech上,我们网站的每个页面上都有社交按钮。 所以...如果Facebook资源有一天加载缓慢,则会降低我们的网站速度。 然后向其中添加Twitter,Pinterest,Buffer等,您的网站快速加载的机会几乎减少了。

这就是所谓的同步加载。 您必须完成加载一个元素 before 您加载下一个元素。 如果您能够异步加载项目,则可以加载彼此不依赖的项目。 您可以通过异步加载元素来极大地提高站点的速度。 问题是这些公司为您提供的现成脚本几乎从未经过优化以运行异步。
异步

您可以通过在Pingdom上运行测试来查看影响页面速度的因素:
pingdom页面加载

异步Javascript 允许您编写告诉元素加载的代码 after 页面已完全加载。 没有依赖! 因此,页面加载完毕,一旦完成,就会启动脚本来加载其他元素,在本例中为我们的社交按钮。 如果您是开发人员,则可以阅读精彩的文章, 延迟加载异步Javascript.

这是EmilStenström正确执行此操作的片段:

(function(){function async_load(){var s = document.createElement('script'); s.type ='text / javascript'; s.async = true; s.src ='http://buttondomain.com /script.js'; var x = document.getElementsByTagName('script')[0]; x.parentNode.insertBefore(s,x);} if(window.attachEvent)window.attachEvent('onload',async_load); else window.addEventListener('load',async_load,false);})();

结果是,如果这些第三方集成发生故障或运行缓慢,则从不影响您核心页面内容的显示。 如果您查看我们页面的源代码,您将看到我正在使用该技术加载所有其他社交脚本。 过程 提高了我们网站的速度秒 –并且在加载过程中不会窒息。 我们尚未将所有外部依赖项转换为 异步Javascript,但我们会的。

你觉得呢?

本网站使用Akismet来减少垃圾邮件。 了解您的数据如何处理.