Next.js 是一个火热的 React 前端框架，由 Vercel 公司出品。说起 SSR 大家都会第一时间想到它，其内置的约定式路由，静态资源优化，各种 CSS 方案， turbopack 构建(rust 一统前端构建？)等功能也十分的出色。

之前文章已经大概介绍过 useMemo 的用法，这篇文章会详细介绍该何时、如何正确使用它，并且搭配 React.memo 来对我们的项目进行一个性能优化。

axios 已经逐步成为了 JS 前端甚至 Node 后端主流的网络请求库。其中请求/响应拦截也是使用率非常广泛的功能，众所周知其 get 和 post 请求参数结构不一，使得我们通常会在原 api 上进行二次封装。

既然是封装，那就要考虑到代码的健硕性，参数的扩展性，TS 类型支持，以及可维护性，如何有效设计封装，就是我们接下来要讲的重点。

Rollup 在打包后，在浏览器运行时报错： ReferenceError: process is not defined

通过字面意思可以得知 process 变量是在 node 环境中的变量，浏览器肯定不行，我们可以通过在加载代码之前添加一段 hack 脚本

CSS 中 inset 属性大部分人可能没听过也没用过，其实就是 top right bottom left 的简写方式

inset: 0; 等价于：

div {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}

同时 inset: 1px 2px; 等价于：

div {
  top: 1px;
  right: 2px;
  bottom: 1px;
  left: 2px;
}

inset: 1px 2px 3px; 等价于：

div {
  top: 1px;
  right: 2px;
  bottom: 3px;
  left: 2px;
}

inset: 1px 2px 3px 4px; 等价于：

div {
  top: 1px;
  right: 2px;
  bottom: 3px;
  left: 4px;
}

设置顺序依次为上、下、左、右，这点就和 margin padding 等属性的统一设置规则一样。

4 行缩成 1 行，在代码简化上，倒是起了很大的帮助。

前端开发中，我们经常看见有一些全局脚手架包通过 xx create app-name 或者 npx xx app-name 等命令，就可以快速生成一个对应的模板项目，他们是怎么做到的呢？

官方安装说明：https://nodejs.org/en/download/package-manager/#enterprise-linux-and-fedora

系统的 yum 源安装 nodejs 版本太低。如果你的系统版本比较低，gcc 库版本低，编译安装的时候有可能不成功，下面是 yum 安装的步骤

前端开发中，经常会有处理 url query 参数的需求，大部分人会自己封装一个方法，去用正则转换解析成 js 对象或者遍历生成 query 参数字符串，或者找一些第三方库或 node 原生库 querystring 等。

但是许多人都或者不知道或者没用过 JS 的新的 Window 对象 API：ULRSearchParms， ULRSearchParms 就是专门用来处理 query 参数的各种转换问题。

最近遇到行内子元素垂直居中的需求，按照以往经验设置了子元素 vertical:middle 以及 display:inline-block，但是发现并没有效果。 几经周转查询了 vertical-align 的具体用法，发现主要是因为没有基线对照参照物，所以没有生效。

因此想到添加一个高度 100% 的空的行内元素，并且同时设置 vertical:middle 作为子元素的参照物。