前端性能优化

背景 我们之前已经聊了很多Promise的原理知识，下面走进它的应用领域，也就是它有哪些性能优化上的用途，显然 性能优化有一part是 异步处理优化，也就是网络请求的优化。Promise在这方面可以说

背景 这篇文章总结下手写 Promise.xxx 的 核心要点，大家可以交叉对比一下，希望大家可以对这几个API的本质有更清晰的认识，也为我们后面场景应用打下基础。 Promise.all 直接上完整

背景 Promise 作为 异步编程的老生常谈，这里不免俗也整理一番，以后关于 Promise基础知识看这篇就好了。整理过后，我想说一句话：回调函数可以说是javascript中，所有异步编程方式的根

背景 说实话，async/await 我在日常工作中好像并没有很主动的去用，可能对于异步编程，我宁愿去用 Promise这种显式链式方式告诉自己，这是异步流程。同步式的代码让我有点心有余悸，为啥会这样

背景 这期并不是什么高大上的主题，但是对于支付业务却是尤为重要，那就是如何在前端角度防止重复支付，在这边把我的解决方案记录下来，也想剖析一下里面的细节，同时也分享给大家。 解决方案 一、先理清整体逻辑

背景 之前我们也讨论过，内存泄露对 前端性能的影响，但是对于脚本语言的开发者，内存这件事貌似是个黑盒，且很容易让我们忽略，这几天直观看到了js代码如何影响着内存，简单学习了内存泄露的排查方法，分享给大

背景： 终于完成了阶段性的首屏性能优化的开发部分，该写监控代码验收成效了，这两天研究了下，先看下结果吧： 核心性能指标均实现大幅下降，优化效果显著，具体分析如下： 指标 优化前均值（ms） 优化后均值

为什么需要打包 CommonJS 前模块化时代的困境 CommonJS 规范的出现解决了服务器端 JavaScript 的模块化需求： 核心目标：让 JavaScript 能像 Python、Java

内存管理 深入解析自动内存管理与垃圾回收机制 一、手动内存管理的困境 典型问题示例： ➤ 双重风险：忘记释放导致内存泄漏；错误释放导致程序崩溃 二、自动内存管理机制 1. 内存自动分配 JavaScr

事件循环机制 一、JavaScript 引擎的本质 核心职责： 解析 JavaScript 语法 管理变量和内存 执行代码逻辑 不涉及： 线程管理（Worker除外） I/O 操作 定时器控制 网络请

终于来到浏览器加载html并渲染阶段了 第一次渲染时都发生了什么 生成DOM树 一、HTML 解析与 DOM 树生成流程 1. 流式解析（Incremental Parsing） 触发时机： 浏览器无

终于跨过 TCP，我们来到 发送http请求，响应阶段 TTFB 所谓 TTFB 就是 responseStart- requestStart 一、TTFB的“真面目”与技术本质 TTFB真实包含：网

还记得 一道面试题，开始性能优化之旅（3）-- DNS查询 +TCP（一） 里面我们提到过 TCP的耗时吗？ 对，是至少1RTT 优化手段里我们提到 复用连接，今天我们就由 复用连接引出 今天的主角

接上篇，还是这张图 我们看到最后有一个 SSL Negotiation的耗时，这个又是什么呢？ 接下来我就来聚焦 SSL流程，以及 HTTPS协议的意义 HTTP协议的 安全缺陷！ 一、明文传输：数据

上图！ 本篇开始我们来聊聊 DNS + TCP（TCP+ TLS），其实前端在这些个阶段能做的不多，但是 他们却与前端页面的性能的关系深远，如下图， DNS 将域名解析为 IP 地址，这个目前没啥可说

十一闲来无事，最近看了一本关于前端性能的书，而真的看懂一本书的标准就是能用自己的话说明白书中的知识，所以我想来总结一下，但是性能优化又是一个庞杂的话题，该如何说起呢？直到我看到了这道面试题，一道我们再

还是熟悉的图片 这篇我们来聚焦 App Cache 就像 我们手机的任何一款app都有缓存数据一样，浏览器也有， 浏览器优先检查‌应用缓存（App cache） ‌ 和‌HTTP缓存‌（强缓存如Cac