一次 Chrome 缓存锁的有趣探索

昨天同事问我关于 Node Event Loop 的问题,代码如下:

const Koa = require('koa')
const app = new Koa()
const logger = require('koa-logger')

let index = 0

const sleep = delay => new Promise(resolve => setTimeout(resolve, delay))

app.use(logger())

app.use(async ctx => {
  await sleep(500)
  ctx.body = index++
})

app.listen(3000)

- 阅读剩余部分 -

服务器迁移便捷式笔记

这周连续六天迁移服务器成就达成,本来踩的坑比较琐碎不想整理一下发 CodeSky 了,今天迁移 CodeSky 的时候遇到了以前单服务器配置时候没有遇到过的坑,所以还是记点东西好了。

supervisor

作为一个连续三天写了配置文件忘记重启的人不由得要大喊一声:supervisorctl reload

以前我一直以为大家说的 supervisornode-supervisor……直到看了旧机器的配置信息……

这种时候只要微笑就好了参考资料可以看:

- 阅读剩余部分 -

ECMAScript 标准的十万个为什么 - Symbol 的隐式转换

今天苏老师发了一篇:Symbol Polyfill 填坑之旅,文章中提到 Symbol 隐式转换的问题,作为一个只在文章中看过 Symbol 的萌豚,我也想知道究竟为什么 Symbol 可以有 toString() 方法,却不能进行 '' + Symbol('word') 的操作。

标准

MDN - Symbol 中有一些规则,它告诉我们当 Symbol 尝试隐式类型转换时会报错,但是为什么会这样,底层是是怎么实现的,我们还是不太清楚。

- 阅读剩余部分 -

Node.js 异步原理

写文章写得实在生无可恋,依旧看起了书——《深入浅出 Node.js》,觉得自己确实有错,之后如果有人问我 Node.js 入门怎么入门我可能还是会推荐他网上的教程,但是说到推荐书,这确实是一本很棒的书。

——安利完毕,之后进入正题。

在面试时可能真的会遇到这样的情况,面试官问:请问一下异步是怎么实现的。

之前在听小伙伴说到这个问题的时候一脸黑人问号,毕竟仿佛是一知半解,不得其意,今天总算可以好好聊一聊异步了,也算是一个章节的笔记。不过掌握的还不是很透彻,如果有错误请指出。

- 阅读剩余部分 -

B站 直播室状态监听(bili_live)与 crontab

听说标题要长才有人看。

B 站状态监听也是一个吃饱了没事干试水的项目——除了例行命令行工具之外试了一下命令行可视化交互的库 inquirernodemailer 发邮件,crontab 计划任务,在上次做计划任务的时候用的还是 Python 的 plan 库,现在觉得略麻烦,还是直接写进命令行工具里方便,最后在加上 CI(第一次加还是有点小激动)。

具体的都可以在项目里看到:https://github.com/csvwolf/listen-bilibili-live

- 阅读剩余部分 -

CSS 文字描边效果的研究

前一阵在做 Chrome 插件研究了一波文字前景色的问题,最终我们还是把思路望向了描边,又正好最近看了一波《CSS 揭秘》,里面正好讲到了描边的问题。

最快捷的方法:text-stroke

有个神奇的 text-stroke 属性,如同名字所描述的那样,就是用于文字描边的。

缺点是,它的描边是内描边,占用了字体本身的空间,其二,兼容性太差,这并不是一个标准的属性,目前只支持很少的浏览器,关于它可以阅读:https://developer.mozilla.org/en-US/docs/Web/CSS/-webkit-text-stroke

- 阅读剩余部分 -

一个比价系统的构建

在毕设答辩前后,终于可以说说我的毕设内容了。

首先,我做的实际上是一个比价系统,当然,是那种没有用任何 API 的系统。

换言之,我们要做的事情就是从爬虫开始收集数据,处理数据并且通过搜索展示,其中我的论文题目是「数据融合的研究以及应用」,也就是说需要对同样的商品进行聚合(融合)操作。

这篇文章大致提供一个思路,具体的代码因为写的太辣鸡就不开源了。

- 阅读剩余部分 -

CSS 文字反色的研究

在之前我们使用 Canvas 去计算颜色和反色,之后经过大佬提醒,原来 CSS 本身也是能根据背景色取反显示的。在这里,我们会学习一个新的特征:mix-blend-mode

引用 MDN 的介绍:

mix-blend-mode CSS 属性描述了元素的内容应该与元素的直系父元素的内容和元素的背景如何混合。

- 阅读剩余部分 -

Canvas 优化指南

Canvas 性能是一个非常值得关注的问题,这次用 Canvas 也同样遇到了需要性能优化的点:我们在之前使用 Canvas 实现了 background: cover 的效果,但是这导致了 resize 的反复绘制,CPU 使用率飙升。

使用离屏渲染

对于这种场景,MDN 中的解释是「在离屏canvas上预渲染相似的图形或重复的对象」。

- 阅读剩余部分 -