carry12138

历史上，JavaScript一直没有模块(module)体系，无法将一个大程序拆分成互相依赖的小文件，再用简单的方法拼装起来。其他语言都有这项功能，比如Ruby的require、Python的import，甚至就连css都有@import，但是javascript任何这方面的支…

上节课我们一起了解了sevice worker,它可以用于客户端资源缓存。但sevice worker的用处远远不止于此，它可以拦截所有的客户端http请求并存储返回的response，从而实现离线的客户端正常访问。 离线访问这一特性很容易让人联想到Native App的能力，…

下面，我们就一起来了解一下，在客户端代码控制web离线缓存的sevice worker。 Service Worker 是 Chrome 团队提出和力推的一个 WEB API，用于给 web 应用提供高级的可持续的后台处理能力。 该 WEB API 标准起草于 2013 年，于…

关于静态资源缓存的配置，主要是后端开发的工作，前端开发的同学肯定都有一定的了解但并不深入。 首先还是从一个小故事开始：小c同学是一名前端程序猿，负责公司门户网站的维护。这一天，他的大boss丢给他一张5M的大图，让他放到网站的首页。 这么大的资源，如果每次用户打开网站之后都要重…

小c同学是一名前端程序猿。 这一天，大boss给他下了一个指令：我们的网站图片太多太大，太浪费网络资源了，我要节省流量又不要降低图片质量，你看着办吧。 于是，小c同学想到了图片懒加载：当图片没有出现在用户屏幕上时，用一张轻量级的占位图片代替，图片出现后用js动态替换为高质量图片…

在web开发的过程中，调试是不可或缺的一部分。pc的调试可以通过debugger和console来完成，对console感兴趣的同学，可以参考 但是，如果我们的web页需要兼容移动端，那么调试就变得没那么容易。在本篇文章中，我将介绍几种第三方工具帮助你完成移动端web的调试。 …

骨架屏是在页面数据尚未加载完成前先给用户展示出页面的大致结构, 解决了js加载时间过长页面白页的问题，同时，相对于loading动画，骨架屏的过渡效果更加平滑，用户体验更好。 骨架屏可以由开发人员手动编写，这篇文章中我们使用chrome推出的Node库puppeteer，自动为…

abstract: Welcome to my blog, enter password to read. message: Welcome to my blog, enter password to read. 前端开发人员对闭包这个知识点，一定都不陌生，我们都知道闭包的概念…

Window.history是一个只读属性，用来获取History 对象的引用，History 对象提供了操作浏览器会话历史（浏览器地址栏中访问的页面，以及当前页面中通过框架加载的页面）的接口，允许你在用户浏览历史中向前和向后跳转。 Window.history是一个只读属性，…