网页会加载资源、运行 JS、渲染界面、存储数据等，我们开发时怎么看到执行的状态呢？ 用调试工具 chrome devtools。它支持 dom 调试、JS debugger、本地存储的展示、运行时间的

一开始我只想弄明白js在浏览器里面到底是怎么执行的，发现自己需要补补基础，于是打算总结一个文章来补一下基础，有什么不对的地方还请大佬们指正。 这篇文章大算分几个章节总结一下自己学到的知识点，顺便复习一些计算机基础知识，了解JS代码在浏览器是如何执行的，如何渲染页面的。 然后我们…

前言对于HTML，css和JavaScript是如何变成页面的，这个问题你了解过吗？浏览器究竟在背后都做了些什么事情呢？让我们去了解浏览器的渲染原理，是通往更深层次的开发必不可少的事情，能让我们更深层

web应用的表现，越来越受制于启动时间。我们已经习惯于使用大量的JavaScript代码来开发丰富的web交互体验。从HTTPArchive上，我们可以看到，一个移动设备平均会加载350KB的JavaSript代码，10%的页面会加载超过1MB的JavaScipt代码。复杂的交…

Notification是HTML5新增的API，用于向用户配置和显示桌面通知。上次在别的网站上看到别人的通知弹窗，好奇之余也想知道如何实现的。实际去查一下发现并不复杂，且可以说比较简单，故写篇博客分享给大家,希望能帮你们了解这个API。 该通知是脱离浏览器的，即使用户没有停留…

本文是作者 Tomek Sułkowski 发布在 medium 上的一个系列。据作者透露一共有 24 篇，一直更新到 12 月 24 日 版权归原作者所有。 译者在翻译前已经和作者沟通得到了翻译整个系列的授权。 30. Shadow editor 阴影编辑器 听起来很不吉利 …

resize、scroll 这些事件是何时去派发的。 这些问题并不是刻意想刁难你，如果你不知道这些，那你可能并不能在遇到一个动画需求的时候合理的选择 requestAnimationFrame，你可能在做一些需求的时候想到了 requestIdleCallback，但是你不知道…

作为开发人员，平时用的最多的就是Chrome devtools了，但是可能很多同学都像我一样平时用的最多也就只是Console和Elements面板了。 按Cmd + Shift + P（如果使用Windows，则按Ctrl + Shift + P）打开“命令”菜单。 当你只想…