> 于水增 ## 故事背景 事情起源于之前做的海报编辑器，自己调试时无意中发现字体渲染好慢，第一反应就是网怎么变慢了，断网了？仔细一看才发现，淦！这几个字体资源咋这么大，难怪网速变慢了呢😁😁。

canvas 优化细节 白板方案，大部分同学第一反应，那肯定是 canvas 啊，没错，但是，可以很直接地告诉大家，canvas 方案在大 家平常小数据量的可视化场景，没太

一图胜千言 进程&线程的角度 渲染进程。 包裹标签页的容器。包含了多个线程，这些线程一起负责了页面显示到屏幕上的各个方面。 合成线程（Compositor Thread） 。这是最先被告知垂直同步事件

本篇的性能优化不是八股文类的优化方案，而是针对具体场景，具体分析，从排查卡顿根因到一步步寻找解决方案，甚至是规避等方案来最终解决性能问题的经历实操 所以，解决方案可能不通用，但这个过程可以借鉴

基础概念 Entry：入口，Webpack 执行构建的第一步将从 Entry 开始，可抽象成输入。 Module：模块，在 Webpack 里一切皆模块，一个模块对应着一个文件。Webpack 会从配

前端性能优化前可以先做性能报告，这样可以指定更有效的优化计划。多做性能报告可以培养性能数据的嗅觉，做下一次优化会更有把握。

前言 大家好，我是 simple ，我的理想是利用科技手段来解决生活中遇到的各种问题。 Performance API向开发者提供了访问和测量浏览器性能相关信息的方式。

一、背景 作为一个唯唯诺诺的大三前端人终于出去实习了，在公司的第一个需求是针对公司的某个B端后台系统进行初次加载白屏时间优化的，那为什么要进行优化呢？ 1、白屏时间长影响体验效果 这个后台在第一次加载

在书写的过程中，因为点数量减少导致书写的效果不够理想，因此通过贝塞尔曲线的方式，将点连接起来，形成平滑的曲线，从而达到书写的效果。这节，我们将通过上下分层的方式，优化 Canvas 的书写性能。