我们有很多理由需要好好考虑一下javascript存在的意义(它做了什么,怎么做的以及它有多重要)。
如今,超过一半的网络流量来自移动设备,但这些设备的许多操作都是在极其不稳定的网络连接下进行的,例如,你想要在10秒内单独加载完毕脚本文件几乎是不可能的。
如果您正在使用单页应用,因为没有合理的内容反馈,这可能比您想象的要大得多 - 用户将长时间只能看到部分内容的白屏。
毫无疑问,性能很重要。但javascript对我们的网站有什么常见的负面影响呢?我们目前又应该如何评估性能呢?
让我们简单(但是有建设性)地了解一下javascript的性能花销
我们在评估javascript的性能影响时,通常会关注以下几点:
页面中阻塞渲染的脚本文件的数量
脚本下载所需的时间以及传输的数据量
但是我们经常忽略的是脚本加载之后发生的事情......
一旦设备下载了脚本,就必须对其进行解析,转换为字节码,编译并执行。
正是因为不同的设备解析和编译所消耗的时间长短各有不同,导致了当你在3000美元的macbook和使用两年的智能机上访问同一个网站时速度会有天壤之别。
上述图形比较了常规桌面浏览器与低端移动设备上的chrome解析/编译时间。这张图片引用自addy osmani的优秀文章“javascript start-up performance”。
calibre这个工具旨在帮助团队更好地了解性能和用户体验领域,您可以直接将您的站点分别在有无js文件的环境下进行比较,作为test profile(测试配置文件)。
现在您进行有无使用javascript两种情况的测试
测试的结果相当惊人。下面是卫报网站(the guardian)的测试结果:
the guardian website, with and without javascript
左图:无js,3g连接,iphone 6 - 所有内容在不到5秒内完全可见。右图:3g连接,iphone 6 - 所有内容约10秒钟完全可见,onload事件在大约第20秒时被调用。
很明显,传输的数据并不全是js脚本,还包括额外的内容,图标,甚至一些样式 - 但情况是清楚的:这些内容不是必须的,并且它们破坏了这个页面的性能。
如果您是calibre用户,并且您有兴趣对脚本和脚本进行监控,那么您只需检查“禁用javascript执行”复选框。(您的站点→设置→测试配置文件)。
如果您还没有使用calibre,那么今天可以开始一个免费的14天试用机会。
如果这篇文章让您的开发团队争论没有javascript的情况下网络是否有存在的意义,我对此深表歉意。
如何自学微信小程序开发?了解nofollow标签才能做好网站seo优化什么会影响网站建设报价网络营销对传统营销策略的影响网络公司做网站大概需要多长时间?如何搭建一个优质的外贸营销型网站网站前端开发之正则表达式几个常用字符的使用文章怎么更新对seo搜索排名有帮助?