Linux

诡异的现象:df报文件系统满,但du看差别很大

今天在处理一个问题,最后发现是文件系统满(file system full)造成的,df看一下,果然/opt文件系统的Use%变成了100%。于是马上到/opt目录下用du命令看一下是哪个地方出现了大文件把文件系统撑爆了:du -sm | sort -nr /opt目录分配了30G的空间,我看了一下前几名的占用也不过10G左右。进一步,直接执行du -sh /opt 发现/opt目录的文件总和也不过12G,这就奇怪了,莫非18G被系统吃了??? 无奈Google了一下du df different results,发现原来是系统存在删除的文件没有释放导致。 具体来说是,某进程持有对某文件的引用,

  • maoshuai
2 min read

Headless Browser与服务器端HTML转PDF

最近的项目,要求生成PDF格式的报告书供客户下载或直接发送到Email地址。而且,报告书含有很多图表,基本上是前台HTML页面看到的一样。 这个是一个报表生成的需求,首先从实现的位置看,有两种方案: 由客户端,借助浏览器渲染并生成PDF。 优点:减轻服务器压力,使用HTML转换,与客户端浏览器保持一致。 缺点:无法脱离客户端,遇到需后台发送email的情况,无法实现;不同浏览器无法保证一致性的生成效果。 由服务器端渲染并生成PDF。 优点:可以完全控制生成PDF的效果;可以选择各种语言实现方案 缺点:对服务器压力大;如果用非HTML实现,很难做到和前台一致的效果。 经过比较,结合我需要发送Email的需求,最终选择了服务器端生成。服务器端生成一般有几种方案: 直接操作PDF(比如用Apache的pdfBox)

  • maoshuai
3 min read
Linux

超详细举例看懂Unix的diff格式(1/3):diff的常规模式

在使用git的过程中,难免会用到git diff命令,用于比较文件差异。但初学者对这个命令的输出格式几乎都是一脸懵逼,需仔细研究一番。 我读过阮一峰的《读懂diff》,收获颇大,但还是写了本文。一来,阮一峰文章中的举例过于简单和特殊,有些问题没有解释清楚;二来,也是自己的一份总结。 背景 git的diff,源于Unix的diff命;因此,追本溯源我们要从Unix的diff命令说起。 Unix的diff命令由于历史原因,又分为三种输出格式: 常规格式(normal diff) 上下文格式(context diff) 合并格式(unified diff) 本文是系列的第一篇,介绍diff常规输出格式。

  • maoshuai
12 min read
React

修改create-react-app支持多入口

使用Facebook官方脚手架create-react-app创建React应用,默认只能生成一个SPA,入口是index.html。虽然,SPA的页面切换可以使用前台路由框架方便(比如React-Router)实现,这也是SPA的推荐做法;但某些情况下,仍要将页面切分为多个页面,或者在同一个工程开发多个SPA,比如一个是面向客户的SPA,一个是后台管理的SPA。 (For English readers at article bottom) 我搜索了一下,网上确实有不少人有类似需求:Possible to have multiple entry points? #1079,官方给出的回答是: Sorry, but Create

  • maoshuai
5 min read
React

React技术栈学习路线图

最近,项目上使用React构建前台,我突击了一下相关的知识,暂时搭建了一个简单的开发环境,总结了期间的学习资料,如下: 传统前端基础 HTML+JavaScript+CSS W3school HTML教程 W3school CSS教程 廖雪峰JavaScript基础教程 阮一峰JavaScript 标准参考教程 传统的前端模块化规范CommonJS和RequireJS Javascript模块化编程(一):模块的写法 Javascript模块化编程(二):AMD规范 Javascript模块化编程(三):require.js的用法 ​ 新规范 HTML5规范 W3school HTML5教程 ES6规范:

  • maoshuai
2 min read
React

内网环境Ant Design使用离线Icon图标资源

最近在使用React实现公司一套系统的前端。控件库,看中了蚂蚁金服的Ant Design。 脚手架使用的是React官方的create-react-app,创建完成后,引入了Ant Design。在我自己的笔记本调试的都很好,但放到公司的开发机器上,发现图标资源都无法加载。马上看了一下浏览器的资源请求情况,果然,Ant Design默认使用的是阿里的CDN。 公司是内网环境,显然是行不通的。官方文档果然给出了本地部署的提示。 研究了一番,发现主要是要覆盖@icon-url这个less变量,所以就要开启less支持。幸好官方在自定义主题一节,已经给出了create-react-app中如何实现主题less变量的覆盖;同理,在modifyVar节点增加@icon-url的覆盖,如下: modifyVars: { // 修改整体主题颜色 // "@primary-color"

  • maoshuai
1 min read
思考

被摁在沙发上放血——如何摆脱电视机的束缚

近几年的无数经验告诉我,不要看电视!电视是吞噬时间的恶魔,而首当其冲的又是电视连续剧。 电视节目的放血秘笈 网络视频的蓬勃发展,加上极为丰富的娱乐节目,已经和十几年前完全不同。现在可以说是:只要你有时间,总有足够多的“高质量”电视节目提供给你。这里的**“高质量”的含义是,足够吸引人,消磨时间,但未必有营养**,我称之为把你摁在沙发上放血。 十几年前,电视机还只能收看电视台。早的时候,只能收看当地三四个频道,电视台晚间或者星期二下午还要“休台”,冗长的广告和一天两三集的限制,观众并不会一直坐在电视机前。 后来,家里安装了有线电视,一下子增加了几十个频道;有些电视台更是推出所谓“周末大放送”

  • maoshuai
4 min read
英语

使用有道API在线批量翻译单词

之前,我已经确立了英语学习方针,接下来第一个关键目标,就是词汇量突破到7000这一分水岭。 有网友从COCA上已提取了7000个最常用的英文单词,我根据自身情况,筛选出自己不熟悉的4000个单词,并整理到了Excel中按计划背诵。 在Excel中,也写好了公式,输入背诵的天数,就会自动筛选出当天的新词,以及要复习的旧词(2天、4天、7天、20天各复习一次)。 遗憾的是,这7000个单词并没有提供释义。原本我决定每天背的时候现查词典。我稍微估计了一下时间: 查一个单词并粘贴到我的excel,至少需要10秒 4000个单词,就需要11个小时的查单词时间! 即便拆分到每天,每次查100个要背的单词,一次也要17分钟。 ——这显然是不划算。 本来就很枯燥的背单词,查完100个单词已经不耐烦了,更别提坚持背单词了。本着节约“

  • maoshuai
2 min read