阅文前端团队

我们一个一个简单了解下。 CSS3 动画的 animation-timing-function 属性值除了支持 cubic-bezier() 功能符，还支持 steps() 功能符，可以实现很多小而美的逐帧动画效果。例如 twitter 的 Like 的效果： 把所有序列帧图片…

在本文中，我们将要介绍 ECMAScript 6 中的 generator 是什么，以及关于它们的使用案例。 generators 是可以控制 iterator（迭代器）的函数。并在任何时候都可以暂停和恢复。 如果这不好理解，那让我们看一些示例，这些示例将解释 generato…

即使你可以通过配置 webpack 使得应用尽可能小，追踪它并且知道它包含什么仍然是很重要的。否则，你可能安装了一个让应用大了两倍的依赖却浑然不觉。 这节就来讲几个可以帮助你深入分析 bundle 的工具。 为了监控你的应用大小，可以在开发过程中使用 webpack-dashb…

在优化应用体积之后，下一个提升应用加载时间的策略就是缓存。将资源缓存在客户端中，可以避免之后每次都重新下载。 这个方法可以告诉浏览器去下载 JS 文件，并将它缓存，之后使用的都是它的缓存副本。浏览器只会在文件名发生改变（或者一年之后缓存失效）时才会请求网络。 使用 webpac…

现代 web 应用经常使用打包工具来创建生产环境的“打包”文件（脚本、样式等等），这些文件经过优化和压缩之后能够极快的被用户下载。在使用 webpack 进行 web 性能优化系列文章中，我们将介绍如何使用 webpack 高效的优化站点资源。这将会帮助用户更快的加载网站以及交…

前端重构程序员是一个关注代码同时还要留意体验的异类。代码的优化虽然难，但是有比较多的性能测试工具去证明优化的成果。然而体验这种东西，我们又要如何去证明它的好与坏呢？ 今天我着重会基于「webnovel」PC站点从以上两点给大家介绍，如何从体验的角度去做重构的优化，并如何用数据去…

这个问题颇有争议，主要是因为有一些场景使得这个问题比较难以追因和理解。 让我们先从 Android 开始。Android 系统被设计成监听推送消息，一旦收到一条消息，就会唤醒对应的 Android 应用来处理推送消息，而不管这个应用是否关闭。 Android 上的任何浏览器和上…

到此为止，我们已经浏览了可以改变通知样式的选项，除了样式，我们还可以通过一些选项来改变通知的行为。 点击通知不会触发任何事件。 每个新的通知会逐一有序地展示，浏览器不会以任何方式叠加展示通知。 系统会以音效或震动的方式提示用户（具体方式则取决于设备系统）。 在某些系统上，通知会…

到此已经覆盖了订阅用户并给其推送发送消息。下一步是在用户的设备上接收此推送消息并显示通知（以及我们可能要做的任何其他工作）。 当接受到一条消息时，一个推送事件将被 dispatch 到你的 service worker 中。 对于不熟悉 service workers 的开发者…