服务器端渲染 (SSR) 已经存在了一段时间，但值得进一步探索。这种技术可以使您的网络应用程序更快、更适合 SEO。在本指南中，我们将解释 SSR、为什么您可能想要使用它，以及如何在不费吹灰之力的情况下实现它。我们将介绍基础知识，将其与客户端渲染进行比较，并讨论一些实际示例。
什么是服务器端渲染？从根本上来说，SSR 是在服务器上而不是在浏览器中渲染网页。当用户请求页面时，服务器会完成所有繁重的工作并将完全呈现的页面发送到客户端。然后，客户端 JavaScript 接管使其具有交互性。
服务器在厨房里做准备工作，浏览器只需要装盘和上菜。
这是一个最小的 Express.js 示例：
const express = require('express')const React = require('react')const ReactDOMServer = require('react-dom/server')const App = require('./App')const app = express( ...
生活见闻
未读近些年彩票销售业绩是逐年上涨,聊一聊彩票吧。
你还在等着中彩票么？可能大多数人都有着这样的期待，有朝一日，彩票中个五百万。为此梦想，甚至还养成了定投彩票的习惯。然而，除了偶尔在电视上看到某某彩民中大奖的新闻外，连身边认识的人都鲜有中奖的消息。那么我们到底是否能中奖呢？
下面以双色球为例，抛除彩票本身是否有暗箱操作的可能，仅以真实的数据概率分布来看。
双色球的玩法及设奖方式如下：
「双色球」彩票投注区分为红色球号码区和蓝色球号码区。每注投注号码由 6 个红色球号码和 1 个蓝色球号码组成。红色球号码从 1 ~ 33 中选择(不能重复); 蓝色球号码从 1 ~ 16 中选择。「双色球」彩票以投注者所选单注投注号码(复式投注按所覆盖的单注计)与当期开出中奖号码相符的球色和个数确定中奖等级。「双色球」设奖奖金为销售总额的 **50%**。奖级设置分为高等奖和低等奖。一等奖和二等奖为高等奖，三至六等奖为低等奖。高等奖采用浮动设奖，低等奖采用固定设奖。当期奖金减去当期低等奖奖金为当期高等奖奖金。
按照上述设奖方式可以得到彩票的中奖概率如下：
从上表可以看出，高等奖（一般为 20w 及以上）仅 ...
Part 1 - Local Repo Config
先 Fork 感兴趣项目，即 SwifterSwift/SwifterSwift
Clone 到本地，git clone git@github.com:SwifterSwift/SwifterSwift.git
添加源项目 SwifterSwift/SwifterSwift 作为 upstream 源，https://github.com/SwifterSwift/SwifterSwift.git
禁止直接向 upstream 源 push，因为我们不是 SwifterSwift 的人，没有 push 的权限，要提交代码必须通过 Pull Request，git remote set-url --push upstream no_push
创建并切换到本地的新分支 bugfix，git checkout -b bugfix
本地分支 master 的作用是与远程 upstream 的最新代码同步
本地分支 bugfix 则是我们修改代码的战场
Part 2 - Fix Bug
fix bug
在当前 bugfix 分支提交本地 ...
我们知道如果是一般的压缩文件，可以用系统自带的或者很好用的压缩工具 Keka 来解压，但如果要解压的压缩文件设置了密码，这个时候怎么做呢？
1. 下载 Homebrew你可以直接去 Homebrew 官网 下载，如何下载 Homebrew 的教程，网上有很多这里不赘述。
2. 安装 fcrackzip我们要用的是一个名为 fcrackzip 的压缩工具，打开终端，在命令行中输入
brew install fcrackzip
然后按下回车后即可安装。
3. 关于 fcrackzip 的参数在终端输入 fcrackzip -h 命令可以查看关于压缩时的详细参数，如下图所示
参数后面都有详细的说明，不再说明，下面直接说下如何使用，请看第四步。
4. 如何使用 fcrackzip 解压带密码的压缩文件直接在终端输入一行代码就行
fcrackzip -b -c 'aA1' -l 1-10 -u
然后在后面跟上你要解压文件的绝对路径（直接把你的文件拖动到终端即可），如下图所示
5. 建议建议把你的文件名改为纯英文字母，比如 aaa 等，因为有的粉丝的文件名包括但不 ...
1. 创建仓库命令
git init: 初始化仓库就是在当前目录下创建一个.git 目录，用于存储 Git 所需的元数据和文件版本记录。该目录包含了 objects、refs/head、refs/tags 和模板文件等基本部分。
git clone [url]: 拷贝一份远程仓库，也就是下载一个项目和它的整个代码历史。
2. 配置
git config --list: 显示当前的 Git 配置
git config -e [--global]: 编辑 Git 配置文件
git config [--global] user.name "[name]" / git config [--global] user.email "[email address]": 设置提交代码时的用户信息
3. 增加/删除文件
git add [file1] [file2] ...: 添加指定文件到暂存区
git add [dir]: 添加指定目录到暂存区，包括子目录
git add .: 添加当前目录的所有文件到暂存区
...
永远不要过早优化，要做到因地制宜，见招拆招。
Vue 应用运行时性能优化措施1. 使用 key对于通过循环生成了列表，应该给每个列表项一个稳定且唯一的 key，这有利于在列表变动时，尽量少的删除、新增、改动元素。
2. 使用冻结对象冻结的对象不会被响应化。有的时候没有必要将数据变成响应式的数据，因为在数据的响应化的过程中需要递归遍历数据，需要耗时。
Object.freeze(this.data)
如果不希望数据被 Observer，其实可以在 created 的生命周期中把数据挂在到 this 上，并不一定都在 data、props 或者是 computed 中定义。另外，这部分数据也是可以被修改的，只是他们的变化不会触发组件重新渲染，因为我们也并不希望，这样比用 Object.freeze 更加灵活。
3. 使用函数式组件参见 函数式组件
使用函数式组件，在 js 执行时间以及渲染时间上稍有减少，但是差别不大，同时在内存占用（消耗）方面会比普通组件占用少，这是因为使用函数式组件不会在 vue 的组件树中生成该组件，不会为函数组件创建实例，只是纯渲染。对于普通组件，vue ...
前言
iTerm2 是默认终端的替代品，也是目前 Mac 系统下最好用的终端工具，集颜值和效率于一身。
最近换了一台新的 MacBook Pro ，需要重装电脑上的常用软件。为了将 ITerm2 DIY 为自己喜欢的样子，花了不少时间。为了方便下次再配置，特地写下此文进行记录。
iTerm2 的下载链接：iTerm2
iTerm2 的配置1. 查看系统所有的 shell 列表cat /etc/shells
设置默认 shell 为 zsh，它功能比较多，会好使一些。
chsh -s /bin/zsh
2. 安装 oh-my-zshoh-my-zsh 是一款社区驱动的命令行工具，它基于 zsh 命令行，提供了主题配置，插件机制，大大提高了可玩（用）性。它的 Github 地址为：https://github.com/ohmyzsh/ohmyzsh
我们可以使用 curl 安装：
sh -c "$(curl -fsSL https://raw.github.com/robbyrussell/oh-my-zsh/master/tools/install.sh)"
...
渲染时间点
渲染过程
当浏览器的网络线程收到 HTML 文档后，会产生一个渲染任务，并将其传递给渲染主线程的消息队列。
在事件循环机制的作用下，渲染主线程取出消息队列中的渲染任务，开启渲染流程。
整个渲染流程分为多个阶段，分别是： HTML 解析、样式计算、布局、分层、绘制、分块、光栅化、画
每个阶段都有明确的输入输出，上一个阶段的输出会成为下一个阶段的输入。
这样，整个渲染流程就形成了一套组织严密的生产流水线。
1. 解析 HTML - Parse渲染的第一步是解析 HTML。
解析过程中遇到 CSS 解析 CSS，遇到 JS 执行 JS。为了提高解析效率，浏览器在开始解析前，会启动一个预解析的线程，率先下载 HTML 中的外部 CSS 文件和 外部的 JS 文件。
如果主线程解析到link位置，此时外部的 CSS 文件还没有下载解析好，主线程不会等待，继续解析后续的 HTML。这是因为下载和解析 CSS 的工作是在预解析线程中进行的。这就是 CSS 不会阻塞 HTML 解析的根本原因。
如果主线程解析到script位置，会停止解析 HTML，转而等待 JS 文件下载好，并将 ...
浏览器的进程模型何为进程？程序运行需要有它自己专属的内存空间，可以把这块内存空间简单的理解为进程
每个应用至少有一个进程，进程之间相互独立，即使要通信，也需要双方同意。
何为线程？有了进程后，就可以运行程序的代码了。
运行代码的「人」称之为「线程」。
一个进程至少有一个线程，所以在进程开启后会自动创建一个线程来运行代码，该线程称之为主线程。
如果程序需要同时执行多块代码，主线程就会启动更多的线程来执行代码，所以一个进程中可以包含多个线程。
浏览器有哪些进程和线程？浏览器是一个多进程多线程的应用程序
浏览器内部工作极其复杂。
为了避免相互影响，为了减少连环崩溃的几率，当启动浏览器后，它会自动启动多个进程。
可以在浏览器的任务管理器中查看当前的所有进程
其中，最主要的进程有：
浏览器进程
主要负责界面显示、用户交互、子进程管理等。浏览器进程内部会启动多个线程处理不同的任务。
网络进程
负责加载网络资源。网络进程内部会启动多个线程来处理不同的网络任务。
渲染进程（本节课重点讲解的进程）
渲染进程启动后，会开启一个渲染主线程，主线程负责执行 HTML、CSS、JS 代码。
默 ...
本文整理了七种常见 GC 算法的基本原理，包括 GC 标记-清除法、引用计数法、GC 标记-复制算法、GC 标记-压缩算法、保守式 GC、分代垃圾回收、增量式垃圾回收(三色标记法)，可以作为学习 GC 知识的框架。
前言本文主要是中村成洋、相川光写的《垃圾回收的算法与实现》一书的读书笔记，没有输出的学习就是一盘散沙。我们要学习 GC 就要系统性的学，形成自己的知识框架，后面再学习其他的 GC 实现，就知道该放在框架的哪个地方，本文起到了作为 GC 知识框架的作用。不管技术风云怎么变化，打牢基础总是不会错的。
一、为什么要有 GC1.1 什么是 GCGC 是 Garbage Collection 的简称，中文称为“垃圾回收”。GC ，是指程序把不用的内存空间视为垃圾并回收掉的整套动作。
GC 要做的有两件事：
找到内存空间里的垃圾；
回收垃圾，让程序能再次利用这部分空间。
满足这两项功能的程序就是 GC。
1.2 为什么要有 GC在没有 GC 的世界里，程序员必须自己手动进行内存管理，必须清楚地确保必要的内存空间，释放不要的内存空间。
程序员在手动进行内存管理时，申请内存尚不存在 ...
