Csy Blog

正确的开始,微小的长进,然后持续。祝我们有一万次微小的闪耀。

前端存储之IndexedDB

前言 - 前端存储 Cookie 存储空间只有4k,存储时间有限制,每次请求都会带上Cookie,而且最重要的是,Cookie设计之初就不是就是让我们前端存数据用,而是为了让网站验证用户身份用的。 Web Storage 存储空间有5M大小,有永久存储的localStorage和会话期间存储的sessionStorage。对比Cookie优势很明显,但现在web不断发展,5M对于一些...

记录一次 Node.js 应用内存泄露

前言 内存泄漏对于前端的影响通常都是发生在客户端上,而且基本上现代浏览器也会做好保护机制,一般自行刷新之后都会解决。但是,一旦后端内存泄漏造成宕机之后,久而久之整个服务器都会受影响,甚至瘫痪。虽然可以用pm2设置一个内存值上限,超过自动重启,但是知道有问题却一直未解决的感觉太难受了。还是要找到问题的根源,为什么会发生内存泄露?哪个变量发生了内存泄露? 一、什么是内存泄露 1、内存的生命...

Koa洋葱模型与面向切面编程(AOP)

前言 - 什么是AOP AOP又叫面向切面编程,是一种非侵入式扩充对象、方法和函数行为的技术。什么是非侵入式呢?侵入式是需要知道框架中的代码,与框架代码紧密结合在一起。非侵入式是可以自由选择和组装各个功能模块,没有过多的依赖。有很多方式可以增加和合并方法,例如继承、组合、委托。通过AOP可以从“外部”去增加一些行为,在很多情况下,AOP比其他方式更灵活、更少侵入。简而言之,AOP就是在现有...

《重构:改善既有代码的设计 第二版》笔记

该笔记不适合人类舒适地阅读 重构第一步:有一套可靠的测试集,可以借助测试框架配置好这些测试,否则就得耗费大把时间来回比对,降低开发速度。重构精髓:小步修改,每次修改后就运行测试。 重构手法 提炼函数 以查询取代临时变量 从赋值表达式的右边提炼一个函数来 内联变量 改变函数声明 拆分循环 以多态取代条件表达式 以管道取代循环 何时重构 由经...

symbol到底是什么?

前言 Symbol是ES6的特性,现在ES9都出来了。以前看过Symbol,但是这么久都没有用过就渐渐只记得名称了。 MDN上的描述: “数据类型 “symbol” 是一种原始数据类型,该类型的性质在于这个类型的值可以用来创建匿名的对象属性。该数据类型通常被用作一个对象属性的键值——当你想让它是私有的时候。symbol 数据类型具有非常明确的目的,并且因为其功能性单一的优点而突出;一个 ...

nginx之HttpProxy模块

前言 虽然以前配置过几次nginx,因为不常用,一直没有系统的去整理学习过。今天遇到了点问题,感觉之前一直都是似懂非懂,非常有必要做个小结。 当nginx使用了HttpProxy模块,用户的整个请求会在nginx中缓冲直至传送给后端被代理的服务器。默认缓冲区大小等于指令,一般等于页面大小,可能是4K也可能是8K,取决于平台。但我们可以把它设置得更小。如果缓冲区开启,nginx假定被...

Layabox小游戏试玩小结

一、试玩历程 随着微信小游戏的大热,我们组的运营也坐不住了。从18年9月份的时候开始接触Layabox游戏引擎,当时看了一篇文章对比了各大游戏引擎,作者用各种数据安利Layabox,说是目前全球性能最高的HTML5引擎之一。那就来试试吧。 第一个小游戏《玩个锤子》,用TypeScript + Layabox进行开发。 当时layabox官方已经发布了LayaA...

闭包和高阶函数

1. 高阶函数 什么是高阶函数? 函数可以作为参数传递 函数可以作为返回值输出 1.1 函数作为参数传递 即经常用到的回调函数 1.2 函数可以作为返回值输出 “无论通过何种手段将内部函数传递到所在的词法作用域以外,它都会持有对原始定义作用域的引用,无论在何处执行这个函数都会使用闭包。” – 《你不知道的javascript》 举例函数作为返回值输出: :chestnut:1...

JavaScript的reduce

前言 在《重构》这本书里,提到了一个重构的方法“以管道取代循环”,那么什么是管道呢?reduce是如何工作的? Array.reduce(callback[, initialValue]) reduce(归纳),为数组中的每一个元素执行callback方法,并将每次callback方法的返回结果,作为下一次调用callback方法的参数 (通常也把这种思想叫做管道机制pipeli...

CSS3实现环形倒计时、圆形进度条

需求 答题、问卷形式的活动经常用到的环形倒计时。进度条通常都是长条,有时候也有环形进度条的需求。倒计时是从有到无,相反的,进度条从无到有。实现方式差不多。 实现思路 如果只是实现一个圆环,可以这样写 1 2 3 4 5 6 7 8 9 <style type="text/css"> .circle { width : 200px; height :...