之前给团队的同事做了一次极易理解的 Redis 入门分享，这里加以整理修改成文章分享给需要的童鞋： 本文将会从：Redis 使用场景与介绍 -> 数据结构与简单使用 -> 小功能大用处 -> 持久化、主从同步与缓存设计 -> 知识拓展 来书写，初学的童鞋只要能记住 Redis 是用来干嘛，使用场景有哪些，然后对 Redis 有个大概的认识就好啦，剩下的以后有需要的时候再来查看和实践吧。 目录 Redis 介绍 Redis 是什么？ Redis 特性 Redis 典型使用场景 Redis 高并发原理 Redis 安装 下载 Redis 解压并安装 Redis 移动 Redis 目录（可选） 编译 安装 Redis 启动 redis.conf 配置文件 Redis 数据结构与命令使用 ...

在业务中常会用到分享图片或者说截图这一功能，利用标题和固定图片分享对用户的吸引力有限，若脱离 web 利用原生手机的截屏也会存在长图无法处理，视窗区域不可控等等问题。能否根据内容生成带有用户独特的分享图方案？ 主流截图方向在解决方案上主要有2种解决思路：前端截图和服务端截图 前端截图前端截图主要会用到 html2canvas 这个第三方库，主要原理是将 DOM 结构绘制在 canvas 上面产生图片。但是坑很多，例如：图片需要时间戳，无法利用缓存；对很多css3样式无法支持，存在比较多的兼容性；截图模糊；有背景音乐的时候，生成图的时候会出现响声，音频文件也会重复加载等等；当前业界也有利用 html2canvas 处理的，例如：阿里咸鱼的H5分享截图方案优化。 服务端截图服务端截图主要原理前端将 dom 结构或者 ...

最近项目中需要在 orange-ci 中进行利用 puppeteer.js 进行截图保存等一系列操作。那么问题马上就来了：在 orange-ci 中 puppeteer.js 如何运行？ 在 orange-ci 中运行 puppeteer.js 也是基于 Linux 环境，在 Linux 环境中安装 Chromium 最长见的 2 个问题就是： 下载 Chromium 时，下载常常以失败告终。换个镜像源后 Chromium 能下载成功，但启动后各种报错，是 Linux上 缺少部分依赖导致的（最新的两个版本我测试不会出现下载 Chromium 失败的情况了，旧项目使用的 5.x 版本经常失败） 安装完需要的依赖，代码顺利运行。但截图却发现浏览器上的中文字体竟全是框框框框，缺少中文字体库 上面两个问题也可以侧面 ...

JS 中，字符串转数值的方式有以下 9 种： parseInt() parseFloat() Number() Double tilde (~~) Operator Unary Operator (+) Math.floor() Multiply with number The Signed Right Shift Operator(>>) The Unsigned Right Shift Operator(>>>) 这几种方式对运行结果的差异，如下表所示： 除了运行结果上的存在差异之外，这些方法在性能上也存在着差异。在 NodeJS V8 环境下，这几个方法微基准测试的结果如下： 123456789parseInt() x 19,140,190 ops/sec ±0.45% ...

开始前先推荐一篇开源 docker 书籍：docker–从入门到实践 这两天由于需要使用 docker 新建一个镜像来给项目使用，然后在使用 docker 的过程中做了一点点小结，希望可以帮到大家。 常用命令 使用 docker help 可以查看所有命令帮助，使用 docker xxx命令 --help 可以查看命令的语法，例如：docker pull --help，可以看到命令行返回为：Usage: docker pull [OPTIONS] NAME[:TAG|@DIGEST] 使用 docker pull xxx 获取镜像，如果带有 tag 标签，则为 docker pull xxx:tag 使用 docker run 运行镜像，运行常用：docker run -it --rm -u root x ...

这几天在复习 nginx 的知识，刚好就把常用的 nginx 操作整合出来，方便查阅，这里分享给大家： 本文将会从：安装 -> 全局配置 -> 常用的各种配置 来书写，其中常用配置写的炒鸡详细，需要的童鞋可以直接滑倒响应的位置查看。 目录 安装 nginx nginx 配置 基本结构 主要配置含义 nginx.conf 配置文件的语法规则 内置变量 常用命令 配置 nginx 开机自启 配置 nginx 全局可用 nginx 常用功能配置 反向代理 访问控制 6 种负载均衡策略 gzip 压缩 HTTP 服务器 动静分离 请求限制 正向代理 图片防盗链 适配 PC 或移动设备 设置二级域名 配置 HTTPS 配置 HTTP 转 HTTPS 单页面项目 history 路由配置 配置高可用集群（双 ...

缓存是性能优化中极其重要的一环，它可以大大减少网络传输所带来的时间成本，节省宽带流量，减少了服务器的负担，大大提高了网站性能。 常见的缓存分类有： 浏览器缓存（HTTP 缓存） 代理服务器缓存 服务器缓存 数据库缓存 CDN缓存 应用层缓存 对于一个 HTTP 请求来说，可以分为发起网络请求、服务端处理、浏览器响应三个步骤。浏览器缓存可以帮助我们在第一和第三步骤中优化性能。比如说直接使用缓存而不发起请求就是属于第一步；发起了请求但后端存储的数据和前端一致，那么就没有必要再将数据回传回来，直接利用浏览器本地缓存，属于第三步。 浏览器缓存缓存位置分为四种，并且有优先级之分，当依次查找且都没有命中的时候，才会去发送请求获取资源： Service Worker Memory Cache Disk Cache Pu ...

1、js运行之前，会把带有var和function关键字的事先声明，但不会赋值123456789alert(a) //function a(){alert(10)}a();//执行alert(10)var a=3;function a(){ alert(10)} alert(a) //3a=6;a(); //a已经不是一个函数了报错 123456789alert(a) //undefineda(); // 报错 a 不是一个函数，函数表达式函数必须在表达式之后调用var a=3;var a=function(){ alert(10)} alert(a)a=6;a(); 考点：第一变量和函数声明提前，第二函数声明优先于变量声明！ 2、 ...

这篇文章的优化内容是建立在 webpack 4.x 上的，后面也会有 webpack 5.x 相关的介绍 优化方式总览加快构建速度(打包速度) 使用 speed-measure-webpack-plugin 插件可以测量各个插件和loader所花费的时间，量化打包速度，判断优化效果 缩小文件的搜索范围(配置include/exclude resolve.modules resolve.mainFields alias noParse extensions) 通过 exclude、include 配置来确保转译尽可能少的文件 优化 resolve.modules 配置 优化 resolve.mainFields 配置 alias noParse extensions 在一些性能开销较大的 loader 之前 ...

这几天复习整理了一下 HTTP 相关的知识点，把相对重要的知识点都整理了出来，方便查于复习，这里继续分享给大家： 什么是HTTP协议HTPP(HyperText Transfer Protocol) 是一种超文本传输协议，用于客户端和服务器，通过请求和响应的交换来达成通信。 HTTP 属于 TCP/IP 协议族，TCP/IP 协议族是互联网相关联的协议集合起来总称（不仅仅指的是 TCP 和 IP 两个协议）。下图可以展示出 ISO 七层模型和 TCP/IP 协议族分层的关系： 从上图可以看到，TCP/IP 模型合并了 OSI 模型的应用层、表示层和会话层，将 OSI 模型的数据链路层和物理层合并为网络访问层。 童鞋们可能还经常听说计算机协议的 5 层模型，即：应用层、运输层、网络层、链路层、物理层，本质都一 ...