集成 Express、Parcel 和 Vue

最近终于动手整理项目的框架,总体思路和去年基本一致,“无状态”和“按功能模块分目录而不是按前后端”仍然是核心的思想,不过具体的工具发生了变化。

  • 数据存取这边用 GraphQL 取代 PouchDB ,在灵活性和可预测间做一个平衡;
  • 前端用 Vue 替换 Riot ,主要还是出于生态方面的考虑,虽然复杂度提升了一点,但是可用的第三方库丰富很多;
  • 最后用 Parcel 替换 Webpack 和 dev.js,Webpack4 据说简洁了不少,但还是有阴影,Vue 如果自己写 dev.js 也要比 Riot 的难一点,先用 Parcel 偷个懒把。

当然首要目标还是简化日常开发,于是花了两个小时把 Express、Parcel 和 Vue 集成到一起。做到每次启动后端进程的时候,Parcel 也会同时开始工作,不需要执行另外的命令,也不会占用额外的端口。Parcel 如果不单独占用端口,在项目多的时候,配置起来会清爽很多。

Read More

读《Modern Vim》

上半年技术书看得比较少,也比较慢,这本百来页的书断断续续看了一个月。
毫不夸张的说,Vim 是我用的时间最多的软件,工作以来至少90%的代码是用 Vim 写的,不过相关的技能差不多一直停留在两三年前的水平,毕竟是一个快三十岁的编辑器,本身已趋于成熟稳定,很难再有大惊喜,插件也尝试过很多,留下的也都是精挑细选过,能最大程度地提高我的效率。

不过看到有 Vim 的新书出来,还是要看看,毕竟天天在用,可能还要再用三四十年,一个个小技巧节约下来的时间,累计起来也是非常可观的。

先说个总体评价:有用。

虽然部分章节的知识目前用不上,但也带给我很多新思路。

再说个附加评价:我遇到的第二本附录对我超级有帮助的书,花一本书的钱,只买两页附录也值得。另一本是《jQuery in Action》,用一页附录让我弄懂了闭包的概念。

Read More

使weinre支持https

在远程调试手机网页的工具中,weinre算是元老级的了,但是作为一个独立工具已经很久没有更新(现在成了Cordova的一个子项目),易用性落后于Chrome内置的调试工具,也比不上微信web开发者工具。
但是纯粹在“远程”这一点上,还是无可替代的,不需要连接USB,不需要在同一个局域网,weinre可以调试任何一台连接到你服务器的手机。

weinre通过将一个JavaScript文件引入目标网页达到远程调试的目的,但是在https加密的网站上,会遇到浏览器

SSE 与 LiveReload

来自stackoverflow.com

之前实现了自己的编译工具 dev.js ,用了快三个月,感觉良好,可以彻底把 gulp 甩掉了。不过上次也留下一个小尾巴,整合自动重载功能。

最初的打算是用 live.js 这个方案,因为无需改动自己的代码,只要把 live.js 加载到网页中就可以。不过实际用起来,发现还是有点问题。live.js 本身功能是正常的,但其机制是轮询,会在 network 里留下很多请求记录,调试时看起来很乱。

备选方案考虑了 WebSocket ,不过看起来不如 SSE 简单,如果想要用起来简单,就得上 socket.io 这样的库。不过既然 sse 已经够用,省下一个库自然更好。

Read More

Simple nginScript

nginScript

某客户有定时关闭网站的需求,每天晚上10点后关闭,第二天6点开启,节假日全天关闭。

想到通过 nginx 的配置文件实现,但是自己对 nginx 的掌握一直停留在“够用”阶段,涉及逻辑判断的功能从来没用过,只是知道 nginx 一定具备这样的功能。

网上一搜,马上发现一篇关于通过 lua 控制服务器开关的文章,与我的需求非常类似,只是其基于 lua 模块,而我服务器上用的是官方源,不带 lua 模块,而且跑了好多个网站,自己编译或者换用 openresty 有一定风险搞挂掉,慎重起见又是一番搜索,决定用 nginScript 来实现这个功能。

Read More

dev.js

写完这篇关于 npm scripts 的博客后,我又陆续花了两个半天,将这个定制脚本做到了能让自己满意的程度。功能和性能全面超越了原来的 gulp 脚本,投入的时间也很合理,因为之前无论 gulp 还是 webpack ,都至少花掉我一天时间用在配置上,却达不到理想的效果。

从功能上看,现在的脚本能监视目录、优化代码(主要痛点,市面上没有现成的方案)、检查代码、编译 riot 标签、打包文件,并为自动重载做好了准备。从性能上看,由于充分利用了内存来加速,每次文件变更后触发的流程(优化、检查、编译和打包)提速在十倍以上,从原来的平均超过 1000 ms 到现在的平均不到 100 ms。只是启动仍然需要 2 秒左右,但也比原来稍胜一筹,加上优化难度大、提升空间有限,且一般而言一天也就执行一次,就不强求了。

Read More

用 Prettier 处理 Pug 文件

Prettier

Prettier 是一个新兴的代码格式化程序,但目前支持的语言相对有限,特别对于混合文件的处理仍在比较初级的阶段。

因此,针对 Riot 这种 HTML/Pug 中混合了 JavaScript 和 CSS 的文件,要对其中的代码进行格式化,必须先将文件分解,分别用 Prettier 处理后,再重新合并。

相比 HTML,处理 Pug 这种由缩进决定包含关系的文件倒是更简单,很容易通过一些简单粗暴的方法进行分解。

Prettier 本身也是一种广受欢迎的粗暴解决方案。它的主要动机就是通过将一种固定格式强加给代码,消灭不同风格间的优劣之辫,节约程序员在争辩中浪费的时间,集中精力办实事。因为大多数时候,主流风格间并没有明显的好坏,只是个人喜好不同。

Read More

人生小事——我的故事

快过年了,才突然发现,即将过去的一年是个有趣的年份:工作八年,学编程十六年,虚岁三十二。前者各占后者一半。

人生充满了巧合。

都说“人生大事”,回忆往昔,对我有重大影响的,却偏偏是一些小事。

在这个寒冷的冬夜,躲在被窝里码字,给大家讲讲——我的故事。

Read More

编程熟手入门Go语言

Introducing Go

2018年看完的第一本书,《Introducing Go》是一本介绍 Go 语言的书,针对人群是已经有编程经验的读者。全书,算上封面、目录、附录、索引,总共才 124 页,实际阅读时间(包括手打一遍示例代码并完成每章后面的习题),不到15个小时。我是一次一小时左右断断续续看完的,但是需要的话,完全可以在一个周末看完。

总体评价是短小精悍,有编程经验的读者入门 Go 语言的理想书籍。

Read More

npm scripts

代码两周前就完成了,但是上周工作忙,这周又小小沉迷了泰拉瑞亚,现在才来进行总结。

这次主要讲讲返璞归真,用 npm 取代 Gulp 对前端项目进行一些处理。

这篇文章涉及内容过多,似乎应该拆成多个主题

Read More