薛定谔的猫-前端领域

对于上面提到的实现方案，均不涉及持久化，可将对应的模式保存到本地缓存（localStorage）里，然后每次渲染读取缓存的模式值进行渲染，并且切换的时候修改缓存中的模式即可。

理论上说，FPS 越高，动画会越流畅，目前大多数设备的屏幕刷新率为 60 次/秒，所以通常来讲 FPS 为 60frame/s 时动画效果最好，也就是每帧的消耗时间（帧预算）为 16.67ms，但实际上，浏览器有整理工作要做，因此所有工作需要尽量在 10 ms 内完成。而且新的智能手机有 90Hz 的屏幕而 iPad Pro 的屏幕是 120Hz 的，这会让帧预算分别减少到 11.1ms 和 8.3ms。

在 Apple 的视网膜屏（Retina）中，默认每 4 个设备像素为一组，渲染出普通屏幕中一个像素显示区域内的图像，即 1 CSS 像素跨越 2设备像素，从而实现更为精细的显示效果。移动设备的布局视口的默认值为 980px，比如在一个宽 320px 的移动设备显示一个布局视口宽为 980px 的页面，移动设备浏览器会对这个页面进行缩放直至其布局视口宽度为 320px，使得缩放后的页面显示效果都不会很理想。，就需要对视口进行缩放，使得视觉视口的像素和理想视口的像素 1：1。中间栏为第一个元素优先加载。

三角形border实现首先将元素内容宽高设置为0，设置每个border宽和样式后是四个三角形。等边三角形：通过设置border宽度比为：指定方向 / 非指定方向 = 即可。角落三角形：只设置相邻两个border的宽度，且其中一个设置为transparent。方法二：正六边形分成三个宽高相同的div，然后使用定位以及css3 transform:rotate分别向左右旋转60deg形成正六边形方法一：把正六边形分成三部分，左中右分别是：before 伪元素部分，div 部分，after

预处理器：将类 CSS 语言（Less（.less）、Sass（.scss）、Stylus 等）编译处理成浏览器可解析的真正 CSS。增强了 CSS 代码的复用性，还有嵌套、变量、循环、函数、mixin 等，具有很方便的 UI 组件模块化开发能力。PostCSS，通常被视为在完成的样式表中根据 CSS 规范处理 CSS，让其更有效。它的初始功能只有源文件生成 AST 树，AST 树生成新文件，借助插件机制实现定制化的功能，目前最常做的是给CSS属性添加浏览器私有前缀，实现跨浏览器兼容性的问题。

优化的目的是展示更快、交互响应快、页面无卡顿情况。

当hook入到的生命周期钩子函数是同步的，比如compile（beforeCompile 之后立即调用，但在一个新的 compilation 创建之前） 阶段，只有同步的 tap 方法可以使用。如果不做处理，每次构建时都需要把所有的代码重新构建一次，耗费大量的时间。然后大部分情况下，很多第三方库的代码并不会发生变更（除非是版本升级），这时就可以用到 dll：把复用性较高的第三方模块打包到动态链接库中，在不升级这些库的情况下，动态库不需要重新打包，每次构建只重新打包业务代码。按需加载是通过JSONP实现的。

Vue 除了支持内置的一系列指令，还允许注册自定义的指令 (Custom Directives)。Vue中重用代码的方式：组件、组合式函数和自定义指令。组件是主要的构建模块，而组合式函数则侧重于有状态的逻辑，而自定义指令主要是为了重用涉及普通元素的底层 DOM 访问的逻辑。一个自定义指令由一个包含类似组件生命周期钩子的对象来定义。钩子函数会接收到指令所绑定元素作为其参数。自定义指令比原生HTML attribute 更有用，因为它不仅仅可以在页面加载完成后生效，还可以在 Vue 动态插入元素后生效。

服务端同意连接请求，返回SYN-ACK包，SYN（等于j表示是确认了该客户端的连接请求） 、 ACK =1 （等于1表示有效ACK包，用于验证服务端到客户端通信是否正常）、 seq = y（服务端起始序列号） 、ack = x+1（确认号，期望收到的下一个数据的开头），进入SYN-RCVD状态，等待客户端确认（客户端是典型的 Web 用户入网设备（比如连接了 Wi-Fi 的计算机，或接入移动网络的手机）和设备上可联网的软件（比如 Firefox 和 Chrome 的浏览器）。域名是在互联网的网站的地址。

由一个或多个确定的元素所构成的整体：按照一定的线性顺序，排列而成的数据项的集合。：是一种元素在的线性列表数据结构。动态规划（Dynamic programming，简称DP）是通过把原问题分解为相对简单的子问题的方式求解复杂问题的方法。动态规划常常适用于有重叠子问题、最优子结构性质和无后效性质的问题树是非线性逻辑结构，是n（n≥0）个节点的有限集。当n=0时，称为空树。树的每个节点有一个节点值和包含所有子节点的列表，从图的角度看，即N个节点的N - 1条边的有向无环图。树的最大层级数，被称为树的高度或深

是一个用于传输超媒体文档（例如 HTML）的应用层协议。它是为 Web 浏览器与 Web 服务器之间的通信而设计的，但也可以用于其他目的。HTTP 遵循经典的客户端—服务端模型，客户端打开一个连接以发出请求，然后等待直到收到服务器端响应。HTTP 是无状态协议，这意味着服务器不会在两个请求之间保留任何数据（状态）。

HTML（超文本标记语言，HyperText Markup Language）不是编程语言，而是定义了网页内容的含义和结构的标记语言。。“超文本”（hypertext）是指连接单个网站内或多个网站间的网页的链接。HTML 使用“标记”（markup）来注明文本、图片和其他内容，以便于在 Web 浏览器中显示。HTML由一系列元素组成，标签用于创建元素，标签里的元素名不区分大小写，但推荐将标签名全部小写。不包含任何内容的元素称为空元素，空元素不能存在结束标签，比如。声明即文档

VCC（Voltage Circuit，正极） 和 GND（Ground，负极） 表示电源，A0 - A9 是地址信号的引脚，D0 - D7 表示的是数据信号、RD（Read，读取） 和 WR（Write，写入) 都是控制信号，信号均是0或1。（1）VCC接通 +5V，GND接通0V，使用 A0 - A9 来指定数据的存储地址，然后再把数据的值输入给 D0 - D7 的数据信号，并把WR的值置为 1，执行完这些操作后，即可以向内存 IC 写入数据；是用来暂存指令、数据和地址，可视为内存的一种。

操作系统是运行在计算机上管理计算机硬件与软件资源的软件程序。常见操作系统有：Windows、macOS 、Linux、IOS和Android。操作系统支持额外的扩展，比如 I/O 设备驱动和文件系统，支持按需装载，在UNIX/Linux中叫做共享库(.so，shared library），在Windows中则被称为动态链接库(.ddl，Dynamic Link Library)。（用户程序）通过（设备管理、文件管理、进程控制、进程通信、内存管理）申请使用系统态级别的资源，并由操作系统代为完成的操作。

当进行了会影响布局树的操作后，需要重新计算布局树，会引发布局。为了避免连续的多次操作导致布局树反复计算，浏览器默认会合并这些操作，当 JS 代码全部完成后再进行统一计算（但对于 window.getComputedStyle精确计算会强行刷新队列，无法优化），所以，改动属性造成的 reflow 是异步完成的。，由许多浏览器的特征信息综合起来的，不同特征值的信息熵（entropy，是接收的每条消息中包含的信息的平均量，信息熵越高，则能传输越多的信息，信息熵越低，则意味着传输的信息越少）有异。

如果是函数执行上下文则首先给当前执行上下文的变量对象添加形参及初始值，否则先添加函数声明（函数表达式属于后面的变量声明）及初始值，再添加变量声明（带声明 var/let/const 关键字的）及初始值，完成后被激活为。JavaScript（JS）是单线程的、基于原型的、弱类型的、动态类型的、轻量的、支持面向对象/命令式/声明式编程的、头等函数的、多范式的、解释性（直译式或即时编译）的、也可在非浏览器环境下使用的动态脚本语言。是与执行上下文相关的数据作用域，存储了在上下文中定义的变量和函数声明。

CSS（层叠样式表，Cascading Style Sheets）不是编程语言，而是用来描述 HTML 或 XML（包括如 SVG、MathML 或 XHTML 之类的 XML 分支语言）文档的表现与展示效果的样式表语言。CSS3是CSS的最新标准，是与相反，CSS1/2 的特性在 CSS3 里也可以使用。

Typescript是添加了类型系统的JavaScript，属于弱类型（即允许隐式类型转换）、静态类型语言，适应于任何规模的项目，支持 ES6，由微软开发并开源。Typescript增加的功能包括：类型批注和编译时类型检查、类型推断、类型擦除、接口、枚举、Mixin、泛型编程、名字空间、元组、Await。TypeScript 区分大小写，TypeScirpt 和JavaScript 一样没有整数类型；TypeScript 继承关键字为extends，允许接口继承多个接口；因此，现有的 JavaScript

通过 XMLHttpRequest 的 send 方法以post的方式发送 data 给服务端，可以发送大量的数据，默认发送方式是异步，不会阻塞页面，但会占用一定的客户端资源，且需要特殊处理跨域限制。在上报的时候增加报错时间，用户浏览器信息，对错误类型区分，自定义错误类型统计，引入图表可视化展示，更加直观地追踪。通过将采集的数据拼接在图片请求的后面，向服务端请求一个 1*1 px 大小的图片（gif）实现的，设置它的 src 属性就可以发送数据。通过搜集用户的操作，可以明显发现错误为什么产生。

微前端是一种由独立交付的多个前端应用组成整体的架构风格。具体的，将前端应用分解成一些更小、更简单的能够独立开发、测试、部署的小块，而在用户看来仍然是内聚的单个产品。旨在解决单体应用在一个相对长的时间跨度下，由于参与的人员、团队的增多、变迁，从一个普通应用演变成一个庞大应用后出现的应用不可维护的问题。微前端增加了操作/管理上的复杂性，团队自治程度的增加，可能会破坏协作，因此需要考虑是否具备采用这种方法所需的技术和组织成熟度。最大的意义在于解锁了多技术栈并存的能力，尤其适用于渐进式重构中架构升级过渡期。

混合开发是指使用多种开发模开发App的一种开发模式，涉及到两大类技术：原生 Native、Web H5。原生 Native 主要指 iOS（Objective C）、Android（Java），原生开发效率较低，开发完成需要重新打包整个App，发布依赖用户的更新，性能较高功能覆盖率更高；Web H5主要由HTML、CSS、JavaScript组成，Web可以更好的实现发布更新，跨平台也更加优秀，但性能较低，特性受限。跨平台开发是围绕着和两个主题去打造的，通过在两者之间进行取舍，诞生了多种跨平台解决方案。

设计模式的原则：1.（一个对象或方法只做一件事） 2.（尽可能少的实体或对象间互相作用） 3.（软件实体具有可扩展且不可修改）设计模式是通过代码设计经验总结出的解决问题的一系列套路。

组件从概念上类似于 JavaScript 纯函数（多次调用下相同的入参始终返回相同的结果），它接受唯一的入参（即 “props”，包括JSX 所接收的除ref和key之外的属性（attributes）以及子组件（children），props.children 由 JSX 表达式中的子组件组成，而非组件本身定义），无论是使用函数声明还是通过 class 声明，都绝不能修改自身的 props，返回的是用于描述页面展示内容的 React 元素。在 React 组件中，代码重用的主要方式是组合而不是继承。