请求和响应优化**目的：**更快的内容到达时间。核心思路：更好的连接传输效率更少的请求数控i昂更小的资源大小合适的缓存策略最佳实践：减少 DNS 查找：每次主机名的解析都需要一次网络往返，从而增加了请求的延迟时间，同时还会阻塞后续的请求。重用 TCP 连接：尽可能的使用持久连接，以消除因 TCP 握手和慢启动导致的延迟。减少 HTTP 重定向：HTTP 重定向需要额外的 DNS 查询、TCP 握手

Web 性能测试作为网站应用的开发者或维护者，我们需要时常关注网站当前的健康状况，譬如在主流程运行正常的情况下，各方面性能体验是否满足期望，是否存在改进与提升的空间，如何进行快速且准确的问题定位等，为了满足这些诉求，我们需要进行全面且客观的性能检测。性能检测的认知性能检测作为性能优化过程中的一环，它的目的通常是给后续优化工作提供指导方向、参考基线及前后对比的依据。性能检测并不是一次性执行结束后就完

前端页面的生命周期性能问题呈现给用户的感受往往是简单而直接的：加载资源缓慢、运行过程卡顿或响应交互迟缓等，当把这些问题呈现到前端工程师面前时，却是另一种系统级别复杂的图景。从域名解析、TCP 建立连接到 HTTP 的请求与响应，以及从资源请求、文件解析到关键渲染路径等，每一个环节都有可能因为设计不当、考虑不周、运行出错而产生性能不佳的体验。作为前端工程师，为了能在遇到性能问题时快速而准确地定位问题

single-spa 概述single-spa 是一个实现微前端架构的框架。在 single-spa 框架中有三种类型的微前端应用：single-spa application / parcel：微前端架构中的微应用，可以使用 vue、react、angular 等框架。single-spa Application 和路由相关联的，根据路由决定访问哪个微应用。single-spa Parcel 的

vscode 提供调试功能可以调试 node php go 等程序。它需要先创建一个配置文件 launch.json 才能开始调试。以 Node 为例：自动创建的 launch.json：{// 使用 IntelliSense 了解相关属性。// 悬停以查看现有属性的描述。// 欲了解更多信息，请访问: https://go.microsoft.com/fwlink/?linkid=830387"

图片优化前端大部分的工作都围绕在 JavaScript 和 CSS 上，考虑如何更快地下载文件，如何提供给用户复杂而优雅的交互，如何高效合理地应用有限的处理和传输资源等，这些是用户感知的全部吗？当然，他们在前端开发和性能优化中的地位举足轻重，但 JavaScript 和 CSS 对用户感知而言，并不是最重要的部分，图像才是。我们在公众号发布文章或用 PPT 进行演讲时，都知道一条高效传递信息的原则

vscode 格式化介绍在vscode编辑代码时，可以使用快捷键 Shift + Alt + F 对代码快速格式化。可以安装 prettier eslint 等插件设置格式化配置。Prettier 支持格式化 html js css vue scss typescript等类型的代码，它仅关注格式，不会校验ESLint它不能格式化eslint的某些规范，例如：space-before-functi

libvips 是一个 C 语言编写的性能非常高效的图像处理库。Node 环境下无法直接使用 libvips，因为处理图像对效率和性能有要求，所以一般都是用 C/C++ 底层代码编写的sharp 是 Node.js 平台上相当热门的一个图像处理库，其实际上是基于 C 语言编写的 libvips 库封装而来，因此高性能也成了 sharp 的一大卖点。sharp 可以方便的实现常见的图片编辑操作，如压

图片优化前端大部分的工作都围绕在 JavaScript 和 CSS 上，考虑如何更快地下载文件，如何提供给用户复杂而优雅的交互，如何高效合理地应用有限的处理和传输资源等，这些是用户感知的全部吗？当然，他们在前端开发和性能优化中的地位举足轻重，但 JavaScript 和 CSS 对用户感知而言，并不是最重要的部分，图像才是。我们在公众号发布文章或用 PPT 进行演讲时，都知道一条高效传递信息的原则

vscode 格式化介绍在vscode编辑代码时，可以使用快捷键 Shift + Alt + F 对代码快速格式化。可以安装 prettier eslint 等插件设置格式化配置。Prettier 支持格式化 html js css vue scss typescript等类型的代码，它仅关注格式，不会校验ESLint它不能格式化eslint的某些规范，例如：space-before-functi