performance

【转载】使用 FLIP 来提高 Web 动画的性能

CSS 动画已经存在很多年了,使用恰当可以很好地提高网站的用户体验,也正是由于其容易使用,就很可能出现性能低下的动画,从而降低了整个页面的运行效率。回想一下:你曾经是否使用过 CSS 来改变元素的宽度、高度或绝对位置?如果回答是肯定的,就意味着你触发了性能低下的重排或重绘计算,在某些情况下甚至可能导致页面闪烁

使用Express Server和Handlebars优化Critical-Path性能

最近,我在一个React同构网站工作。这个网站建立在React上,运行于Express服务器上。一切都进行得十分顺利,但是我仍对CSS包的加载阻塞不满意。因此,我开始考虑如何在Express服务器上进行关键路径的优化。这篇文章主要是如何使用Express和Handlebars进行安装以及配置一个关键路径的性能优化的笔记。

12步创建高性能Web APP

现在,Web App 日益重视用户的交互体验,了解性能优化的方式则可以有效提高用户体验。阅读和实践下面的性能优化技巧,可以帮你改善应用的流畅度、渲染时间和其他方面的性能表现。对 Web App 进行性能优化是一份冗杂沉重的工作,这不仅是因为构建一个 Web App 需要前后端协作,而且需要多方面的技术栈:数据库、后端、前端,需要运行在多种平台:iOS,安卓,Chrome,Firefox,Edge。这太复杂了!不过,还是有一些历经实践的通用方式可以用来优化 Web App 的性能。在接下来的小节中,我们将逐步介绍相关的细节。

性能工具

嗨,各位,又到了周末总结时间!得益于大量的 Grunt 和 Gulp 插件,我们可以轻松实现网站数据的可视化,虽然深入理解这些工具还比较困难,但分门别类的将它们列出来,也是很有帮助的。

如何让你的移动端网站更快

Cindy Krum 最近发表了一篇非常值得一读的文章:《9 Things You Need to Know About Google's Mobile-Friendly Update》,强烈建议在阅读本文前理解一下该文的思想。已经准备好了?那我们开始吧。为了在 4 月 21 号前迅速优化为移动端网站,最简单的方法就是牺牲一些性能。但是谷歌曾经多次提醒我们,站点的响应性能是非常重要的搜索权重点,比如 2010关于桌面端2013 关于移动端 的这两篇文章。在本文中,我将会讲述一下最佳实践方案,希望你在创建或重构设计时牢记这些经验。此外,建议你精读谷歌关于移动友好型站点的指导文档

高性能 HTML

在阅读本文之前,你是怎样优化网页的呢?大多数开发者的焦点集中于 JavaScript、图片、服务器配置、文件压缩合并,甚至是 CSS。虽然 HTML 是前端技术的核心之一,但却一直没有得到应有的重视。HTML 的体积日渐臃肿。目前,全球访问量前 100 的网站每个页面大概有 40kB 的大小,类似亚马逊和雅虎这样的网站,甚至每个页面包含了数千行的 HTML 代码。最近,youtube 主页的 HTML 代码量甚至达到了惊人的 3.5K 行(翻译本文时已达到了 4.8K 行)。

基于 Varnish ESI 的缓存控制方案

对于优化移动端的加载速度,我非常坚信适用于所有用户的优化方案,才是最佳方案。做出这一判断的出发点是因为,我们无法预知用户准确的联网方式,可能他使用的并不是手机,但却在使用手机热点的信号,或者使用的是不稳定的无线信号...

使用 Varnish 优化移动端站点

想象一下,你刚刚发布了一篇博文,并分享到了社交网络。然后,这篇文章恰巧被大V看中再次分享了出去,立即吸引了数百粉丝的目光,引导他们涌入了你的网站。看到这么多的访客量,以及它们的评论,你内心激动不已。突然之间,你的网站就挂掉了,满屏的数据连接错误……或者假想另一种情境,你一直很努力地创业。突然有一天,一个大V在社交网络表达了对贵公司的喜爱之情,字里行间满满的赞叹。关注这个大V的粉丝心动了,又涌入了你的网站。不幸的是,点击连接后却无法进入你的网站,或者进入后无法注册用户,甚至页面相应超时,无法获取产品的序列号。尽管你在社交网络上对此非常诚恳的表达了歉意,但众多的浏览者都不会再有兴趣。

让手机站点像原生应用的四大途径

在移动设备上构建设计良好的网站慢慢变得越来越容易。不论使用什么方法(响应式设计、自适应等),如果你了解你所做的,创建一个美观的网站不是问题。但你的用户可能仍然要求网站有原生app的体验。完成这样的体验是一个挑战。大多数时候,当人们谈论“app”或“原生”的感觉,他们讲的的不是一个网站的视觉体验。他们所讨论的,是用户界面如何对他们的行为进行反馈,以及这种反馈是怎样呈现的。99根据Kyle Peatt的《A Beginner's Guide to Perceived Performance: 4 Ways to Make Your Mobile Site Feel Like a Native App》所译,带大家一起体验让手机站点像原生应用的四大途径。

10个简单有效的方法帮你改善jQuery代码与性能

这是一简短的译文,文章标题就吸引了我,也没有细看就交给Sunnylost同学去译了。译后Sunnylost同学告诉我这篇文章不是十分优秀,后来我看了看,别称不上经典,但对于初学jQuery的同学还是很有帮助的,因此整理后还是发上来,一上让大家参考一下,另一方面不想让Sunnylost花时间译出来的东西就这么沉在我的电脑中。

此篇文章由Sunnylost根据Desi Reuben-Sealey的英文文章原名《10 easy and useful ways to improve your jQuery coding and performance》进行翻译,主要介绍了在写jQuery时的一些改善方法,以及细节注意,从而在编写代码的时候就能改善自己的jQuery代码和相关性能。希望对大家有所帮助。

页面

返回顶部