PS：本文适合对 HTTPS 已经有一定了解的人阅读。

前言

这篇文章我准备了很久，反复修改了很多次，仍不觉得满意，原因是：

1. 网上虽有很多 HTTPS 相关的资料，但是质量参差不齐，而且有些地方的理解还不一致，我不知道哪个是对的。
2. 对于 HTTPS，我很难在实践中应用它，因此，也没法从实践中确认我所理解的就是对的。

背景

页面可视化搭建工具, 是互联网公司中常见的运营工具, 实现了运营人员快速生成和发布页面, 提升页面上线效率; 且无需开发人员介入, 节省开发人力.

本文主要讨论: 设计和开发页面可视化搭建工具包含哪些技术要点.

飞机上的梗

某天，小明同学突然反馈 ：“昨晚发现根本无法使用你们的应用... .... 怎么回事呢”。我和我的小伙伴们立马惊呆了，心想：“老司机多年的经验有一种预感，那就是同学你使用姿势不正确...（此处省略 300 字）”。 然后默默排查了许久，答案竟然是：

相信大家或多或少都有使用过在线文档，国内的像我们在做的腾讯文档还有其他家的很多类似产品。今天主要为大家揭开在线协作的神秘面纱，那就是 OT 算法。

闭包这个概念是前端工程师必须要深刻理解的，但是网上确实有一些文章会让初学者觉得晦涩难懂，而且闭包的文章描述不一。

本文面向初级的程序员，聊一聊我对闭包的理解。当然如果你看到闭包联想不到作用域链与垃圾回收也不妨看一眼。希望读了它之后你不再对闭包蒙圈。

基于 React 的组件化开发方式，为富前端 web 应用提供大量技术实践，社区逐渐形成了稳定的组件规范，本文从 API 层面归纳出 6 种组件类型，分析其优缺点和适用场景，为日常组件开发提供一个方法指南。6 种类型分别为结构型组件、样式型组件、组合型组件、配置型组件、受控型组件、非受控组件。

正则表达式可能大部分人都用过，但是大家在使用的时候，有没有想过正则表达式背后的原理，又或者当我告诉你正则表达式可能存在性能问题导致线上挂掉，你会不会觉得特别吃惊？

我们先来看看 7 月初，因为一个正则表达式，导致线上事故的例子。

https://blog.cloudflare.com/details-of-the-cloudflare-outage-on-july-2-2019/

简单来说就是一个有性能问题的正则表达式，引起了灾难性回溯，导致 cpu 满载。

在上篇文章我们讲了如何使用 React 的 Suspense 组件和 lazy 方法来实现模块的懒加载，后面还讲了如何使用
React 的 useState 方法来实现自定义的 Hooks，从而达到复用的目的。

我们知道，不管在做什么样的前端项目，列表页肯定是存在的，那如何获取列表的数据呢？大部分情况下我们都是在每个模块内部自己实现一个获取数据的方法，然后调用 setState 来更新数据。那有没有更好的方式可以做到这些，并且能够在一个项目中处处复用这个功能呢？答案就是使用 React Hooks。

JavaScript 单元测试如今对于前端开发来说并不陌生，前端工程化之后项目的代码质量越来越受到重视，单元测试无疑是一种衡量代码质量的重要手段，而测试覆盖率则是衡量测试完整性的一种手段：通过已执行代码的覆盖率，用于评测代码的可靠性和稳定性，可以及时发现没有被测试用例执行到的代码块，提前发现可能的逻辑错误。

伊斯坦布尔（以下简称 Istanbul）是一个基于 JavaScript 的测试覆盖率统计工具，目前绝大多数测试框架比如 jest mocha 等都是使用 Istanbul 来统计覆盖率的。伊斯坦布尔有一个比较老的版本 istanbul.js（已不再维护）和一个新的版本 nyc。虽然使用 Istanbul 的人很多，但是几乎没有介绍其实现原理的文章，那么 Istanbul 计算和统计测试覆盖率的整个流程是怎样的呢？

React Hooks 出来也有一段时间了，在这个过程中有一个前端的 React 项目是专门用的 React 的 FC 组件形式来写的。在过程中提炼了一些使用实例，这里记录下。还有，如果你之前从来没有了解过 React Hooks，建议你先

去 React 官方网站了解 React Hooks 的基本概念和使用方式。
官方文档链接：https://reactjs.org/docs/hooks-overview.html#state-hook