今天分享一个需要前端去推进的优化小点，前端必看，后端也可以看看。 先简单回顾一下跨域请求，当一个资源从与该资源本身所在的服务器不同的域、协议或端口请求一个资源时，此时会发起一个跨域 HTTP 请求。针对跨域，有多种解决方案，不展开说，不是今天的重点。 其中有一种方式叫做”跨域资…

最初做这个系列的时候，就想找个开源又方便的平台。 那时候选择了掘金，因为本意不想收费，所以定价是 0.01 元。(我个人并没有靠此获取任何利益)。 但购买本身是个门槛，而且没办法接收到读者第一时间的反馈（很遗憾我并不在掘金小册群里）。 所以我选择将这个系列加强并且开源出来。希望…

检查在该hosts文件中是否有相应的域名、IP对应关系。 如果有，则直接发起请求。如果没有,再查找DNS服务器得到对应IP地址 拿到IP之后,客户端就可以和服务端建立TCP连接了。 Chrome在同一个域名下要求同时最多只能有6个TCP连接，超过6个的话。其余就得等待 处理完请…

首先要从服务器获取需要渲染的内容，此时获取到的是文件流（进制编码内容），那么接下来浏览器会把16进制字节信息编译为代码字符串，然后按照W3C规则进行字符解析生成对应的tokens，再转换成浏览器内核可以识别渲染的DOM节点，最后再按照节点解析为对应的DOM树和CSSOM树。 d…

简单来说，浏览器缓存就是把一个已经请求过的Web资源（如html，img，js，data等）拷贝一份副本储存在浏览器中。缓存会根据进来的请求保存输出内容的副本。当下一个请求来到的时候，如果是相同的URL，缓存会根据缓存机制决定是直接使用副本响应访问请求，还是向源服务器再次发送请…

想要成为一名合格的前端工程师，掌握相关浏览器的工作原理是必备的，这样子才会有一个完整知识体系，要是「能参透浏览器的工作原理，你就能解决80%的前端难题」。 「这篇文章准备梳理一下渲染流程，也就是浏览器是怎么把HTML，CSS，JS，图片等资源最后显示漂亮的页面。」 「这篇主要是…

Tampermonkey用于运行所谓的用户脚本（有时也称为Greasemonkey脚本）。用户脚本是很小的计算机程序，例如，可以在YouTube页面上添加下载按钮，清理Facebook时间轴或帮助玩在线游戏。 获取当前浏览器窗口的完整页面截图的最简单方法。单击扩展图标（或按Al…

如果你用Chrome调试工具，还是停留在console阶段，赶紧来学习一波吧，绝对是满满的干货，让你效率UpUP。 本文侧重点就是关于Chrome DevTools。通过梳理Chrome DevTools 中的小技巧，这些技巧可以帮我们节省很多的时间，直接提升工作效率！ 上面是…

Renderer Process (渲染进程)负责 Tab 发生的所有事情。 在 Renderer Process 中，主线程 Main Threads 处理你为用户编写的大部分代码。 如果你使用了 web worker 或 service worker，将由 Work Thr…