前言

因为最近在项目中经常需要将数组中的一个元素从数组中剔除，基于 ES6 的选择有比较多，
产生了一个关于几种方法之间执行效率的疑惑，网上也没有太多资料，于是乎本着学习性能测试的想法，展开了一段性能测试的旅程

测试工具

• benchmark 性能测试核心依赖
• mockjs 生成假数据
• lodash 提供另外的筛选数组的方法用于参照

1

yarn add benchmark mockjs lodash

测试思路

首先定义四种方法来测试数据删除操作，他们分别是 Array.prototype.filter Array.prototype.splice lodash.reject lodash.filter

然后使用 mockjs 生成两个数组，长度分别是 100 和 1000，用四种方法分别对这两组数据进行测试。
需要注意的是，在测试时需要对测试数组进行深拷贝，避免他们之间相互影响(毕竟 Array.prototype.splice 会改变原数组)

然后我们对其中一组数据进行测试，来校验我们写的方法是否正确

最后运行 benchmark，比较结果得出结论

简介

testcafe (官网) 是一个基于 nodejs 的自动化测试框架，优点就先不多说了，我们直接进入正题！

安装

testcafe 是一个 npm 包，它可以使用 npm 或 yarn 包管理器进行安装，这里我们使用 yarn 进行安装（因为它很快）

如果你的机器上没有安装 yarn，那么你可以使用 npm 来安装 yarn 😊

1	npm install -g yarn

在命令行中运行以下命令

1

yarn global add testcafe

这样， testcafe 就安装在你本机上啦

小试牛刀

创建一个测试项目

我们新建一个目录，用于练习我们的自动化测试框架 testcafe

1
2
3

# 首先切换到你用于管理 web 项目的根目录，我本机是 "~/www"
cd ~/www
mkdir testcafe && cd testcafe

使用 Vue + Koa 打造全栈应用《时光·印象》图片分享应用 系列教程

前言

之前在学校用前端 pjax 无刷新跳转 + 后端 php 服务端渲染做了一个应用, 用来做校内的图片分享网站, 后来离校后就没怎么管了, 所以只做了一点就弃坑了.

最近又想起来那个项目, 所以这次抱着学习的心态使用 vue + koa 来重新将这个项目拾起来, 一方面可以学习一些当下的新框架了解前段发展趋势, 另一方面也可以充实下自己的简历.

选型

下面列出该项目的技术选型, 以及原因 (按重要程度排序)

• Vue (v2.5) 单文件组件 响应式

  以及 vue-router vuex axios

  选 Vue 作为前端框架是因为他的单文件组件做模块化开发很方便, 还有现成的脚手架工具 vue-cli, 以及对 @尤大 的 信仰

• Koa (v2.5) 中间件

  以及 koa-router koa-jwt

  选用 Koa 而非 Express 是因为 Express 了解过一些, 想换个口味试试. Express 也确实感受过回调地狱的痛, Koa 的洋葱模型似乎很不错!

  后端只用来提供 API 接口不做 SSR.

• MySQL (v8.0) SQL Database

  常规的关系型数据库，深入学习一下 MySQL，为全栈发展打好坚实的基础

• Eslint 语法检查 防傻瓜

  Eslint 进行代码风格检查和防傻瓜还是非常方便的, 尤其是配合其自带的 --fix 功能自动进行代码格式化. 避免在 coding 的过程中出现一些傻瓜式的语法错误带来的不必要的时间浪费.

  使用 Eslint Standard 配置（Vue 使用 @vue/standard 配置）

• ES6, Stylus 语法糖 预处理

  语法糖! 提高 coding 效率. 但是 Stylus, 一个小众的 css 预处理器, 提供了非常高效和酷炫的写法.

• Yarn 依赖安装

  用 Yarn 就是因为快! 比 npm 快了不是一丁半点! yarn 执行项目内 bin 文件也非常方便, 免去了安装全局依赖的烦恼.

tips: 解决办法在文章底部，请使用右侧导航直接跳转到 解决办法

问题描述

最近在使用 centos 7 时需要升级到 nodejs 10 版本，直接执行 yum update nodejs 发现 yum 源里还是 6.x，并且提示已经是最新版本了。。

？？什么鬼，去 nodesource 查看原来需要将 nodesource 源升级一下，so，执行以下命令

1
2

curl -sL https://rpm.nodesource.com/setup_10.x | bash -
yum upgrade nodejs

竟然发现还是 6.x 版本

1
2
3
4
5
6
7
8

====================================================================================================================
 Package               Arch                  Version                                Repository                 Size
====================================================================================================================
Installing:
 nodejs                x86_64                2:6.11.2-1nodesource                   nodesource                 17 M

Transaction Summary
====================================================================================================================

咦？难道是需要将 node 先卸载了吗？于是 yum remove nodejs 然后 yum install nodejs。。。然后是你猜到的结果，还还还还是 6.x 版本。。。

相信前端的同学们已经接触过栅格化布局了, 只要你用过 bootstrap 或者一些其他的 css 框架.

栅格化布局是一个非常方便的布局方式, 尤其是它的自适应布局, 可以根据屏幕大小缩放容器的宽度.

今天我们用一个 css 预处理器 stylus 来编写一个 只有 50 行代码, 能自定义栅格数, 能响应多个断点, 能推能拉的栅格化布局!

前言

这里是一篇个人学习使用 Linux 操作系统时遇到的一些常见问题以及资料的集合. 用来在日后的操作中做一个 QA 索引. 如果它也能帮到你就再好不过了.

Vi / Vim 版本的选择

Vim 是 Vi 的升级版本，比 Vi 多了语法高亮等更多特性。就版本而言，软件的新版本往往会修正旧版的一些缺陷和不足，所以说能用新版本尽量使用最新版本。

启动 / 关闭 Vim

启动

退出

以下命令在 Vim 的控制模式下使用。

挂起

通过 Vim 命令

通过 Shell 命令

利用 Linux 作业机制，按下 ctrl + z 将当前程序放在后台执行。然后使用 fg 命令重新回到 Vim 编辑器。
详情参考Unix或Linux中&、jobs、fg、bg等命令的使用方法

光标移动、复制粘贴、搜索替换

光标移动

这四个键在键盘上是排列到一起的

| ctrl + b | 向上翻一整页 (backward) |
| ctrl + f | 向下翻一整页 (forward) |
| ctrl + u | 向上翻半页 (up) |
| ctrl + d | 向下翻半页 (down) |
| ctrl + y | 向上滚一行 |
| ctrl + e | 向下滚一行 |
| zz | 让光标所在行居于屏幕中央 |
| zt | 让光标所在行居于屏幕顶部 |
| zb | 让光标所在行居于屏幕底部 |

搜索

取消搜索高亮显示

使用技巧

现在的互联网都鼓励大家使用 Chrome 浏览器，它很强大，本身简洁，支持非常多的插件。但正因如此，大家都比较懒不愿意去花时间学习适应一个新的产品去打造适合自己的浏览器，所以我在这里写下一些使用 Chrome 浏览器的小技巧供大家参考学习。

搜索引擎相关

相信不少朋友不愿意使用 chrome 浏览器是因为它默认的搜索引擎是 google，而对于国内环境来说，普通用户不使用特别手段是上不了 google.com 的，所以你在地址栏输入向搜索的关键词时会跳转到 google 导致无法显示，从而必须先进入到 baidu.com 然后再进行搜索。

修改默认搜索引擎

那有没有简单的方法能够将 chrome 浏览器的默认搜索引擎切换为百度呢？当然有。

进入设置页面，找到 搜索引擎 一栏，将默认搜索引擎切换为百度即可

快捷切换搜索引擎

学到了上面的方法你还不满足，我想在多个搜索引擎中自由切换，比如搜技术类作品用 github，搜视频用 bilibili，搜百科用 wikipedia，搜地名用 map.baidu.com。

按照一般思路，搜百科用 wikipedia 的话要先去 zh.wikipedia.org，然后在该站点的搜索栏中键入要查询的关键字，总共两个步骤。

那我现在教你一个快捷的方法：直接在地址栏键入 wikipedia，然后按下 tab 键，会发现地址栏变成这样：（不过要保证你之前用过 wikipedia 的搜索功能）

自己在使用 git 的过程中遇到了不少问题, 最终我都会花时间把它们解决. 这里记录下我遇到这些场景时的解决办法, 并总结一下各种方法的优缺点, 让大家少走点弯路.

使用案例

正在做一个功能, 这时临时需要做别的修改

你可能会遇到这种情况: 当你正在做一个功能(feature-A)时, 这个功能并没有开发完, 但这时有同学喊你紧急修复一个线上 bug 或者要你 pull 一下代码. 这种情况下你会怎么做呢 ?

• A.

  1 2 3 4 5 6

  git add . // 将当前改动提交至暂存区 git commit -am "save" // "保存"一下这些改动 git checkout master // 切换到 master 分支 // some change commit git push origin master // 修复完成后提交 git checkout feature-A // 切换回功能分支继续开发

• B.

  1 2 3 4 5 6 7

  git add . git commit -am "temp" // 临时"保存"一下这些改动, 因为我最后会撤销它 git checkout master // some change commit git push origin master git checkout feature-A // 切换回开发分支 git reset --mixed HEAD^ // 撤销上一次提交并恢复工作区

• C.

  1 2 3 4 5 6

  git stash // 存储工作区和暂存区 git checkout master // some change commit git push origin master git checkout feature-A // 切换回开发分支 git stash pop // 还原工作区和暂存区

正确姿势

C. 使用 git stash 功能

本文是针对小白的科普向文章, 我会尽量使用浅显通俗的语言, 让小白们尽可能看懂.

很多人有这样一个误区, 在使用电脑感觉比较 “卡” 时, 就想清理一下电脑里面的垃圾来加快运行速度.
但我到底该不该时常清除电脑中的 “垃圾” 呢? 换句话说, 清理 “垃圾” 真的能加速电脑运行吗?

下面我们简单介绍一下 “垃圾”, 如果你只想知道该不该清理, 直接跳到底部结论部分即可.

我使用 360 安全卫士 (版本 11.2) 的电脑清理功能为例, 列举电脑中的 “垃圾” 可以分为哪些类别.