使用tmpfs加速前端构建

tmpfs

前端引入的构建需要处理大量读写脚本、工程(aaa)文件的读写,常见的磁盘IO速度决定了编译速度的快慢。在一个典型的编译环境下面,基于webpack的打包可能会占据到20秒甚至更多,对于频繁更新打包的项目,这里节省的时候就比较可贵了,开发环境可以应用watch选项完成增量的打包,对于发布环境等全量打包环境,对于*inux系统下面的同学,可以借助tmpfs可以使用最低的成本完成速度的提升。

tmpfs在类Unix操作系统上是一个常见的名称会用来做为暂时的文件存储方式,在更多的情况下,它会用虚拟的内存而不是一个永久保存的媒体来做为在文件系统上的使用。所有在tmpfs上存储的数据在理论上都是暂时借放的,那也表示说,文件不会创建在硬盘上面。一旦重启,所有在tmpfs里面的数据都会消失不见。理论上,内存使用量会随着tmpfs的使用而时有增长或消减。维基百科词条

创建tmpfs分区


mkdir -p /data/dev/;

mount -t tmpfs -o size=1G,nr_inodes=10k,mode=0700 tmpfs /data/dev/;

调整tmpfs分区


mount -o remount,size=2G,nr_inodes=100k /data/dev

创建完tmpfs目录后,可以使用linux的文件系统相关命令,mount -l 查看当前的磁盘挂载情况;

使用df -li 可以看inode的使用情况,df -lh查看磁盘的空间使用情况。

磁盘写入测试对比

ssd磁盘写入速度


[root@localhost test]# time dd if=/dev/zero of=test.dbf bs=8k count=100000  conv=fsync

100000+0 records in

100000+0 records out

819200000 bytes (819 MB) copied, 5.91981 s, 138 MB/s

real    0m5.934s

user    0m0.047s

sys 0m2.645s

tmpfs写入速度


[root@localhost test]# time dd if=/dev/zero of=test.dbf bs=8k count=100000  conv=fsync

100000+0 records in

100000+0 records out

819200000 bytes (819 MB) copied, 2.01675 s, 406 MB/s

real    0m2.030s

user    0m0.011s

sys 0m0.633s

webpack打包速度对比

ssd磁盘webpack


[root@localhost wjgl-xlmc-xunlei-com]# gulp webpack

[21:07:23] Using gulpfile /data/vhosts/xunlei.com/wjgl-xlmc-xunlei-com/gulpfile.js

[21:07:23] Starting 'webpack'...

[21:07:45] Finished 'webpack' after 21 s

tmpfs磁盘webpack


[root@localhost wjgl-xlmc-xunlei-com]# gulp webpack

[21:05:33] Using gulpfile /data/dev/wjgl-xlmc-xunlei-com/gulpfile.js

[21:05:33] Starting 'webpack'...

[21:05:34] Finished 'webpack' after 1.29 s

性能提升16倍

tmpfs兼容性

  • tmpfs在linux系统上有很好的支持。
  • mac不支持tmpfs文件系统,可以考虑用ramdisk,原理一样都是利用内存文件系统加速磁盘IO,https://gist.github.com/koshigoe/822455

插入广告分割线


迅雷前端在寻找Node.js和前端开发同事,有兴趣的同学可以投入简历过来,招聘详情描述见招聘详情

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Ubuntu的发音 Ubuntu,源于非洲祖鲁人和科萨人的语言,发作 oo-boon-too 的音。了解发音是有意...
    萤火虫de梦阅读 99,917评论 9 468
  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,565评论 25 709
  • 无意中看到zhangwnag大佬分享的webpack教程感觉受益匪浅,特此分享以备自己日后查看,也希望更多的人看到...
    小小字符阅读 12,543评论 7 35
  • 七月的风摇晃银铃... 送来两个南方天使... 我在最初心动的地方... 数着悠悠白云几行...
    归人沫念阅读 3,101评论 0 11
  • 那时雪花温暖 将你交给冬天 冬天渐至锋利 你已深植心底 我们喜欢雪花 如春深爱蝴蝶 如今你独欢春 于是 背影袅袅娜...
    Aaron雪之堡阅读 3,644评论 0 4