04 2021 档案
摘要:JavaScript 程序越来越复杂,调试工具的重要性日益凸显。客户端脚本有浏览器,Node 脚本怎么调试呢? 2016年,Node 决定将 Chrome 浏览器的"开发者工具"作为官方的调试工具,使得 Node 脚本也可以使用图形界面调试,这大大方便了开发者。 本文介绍如何使用 Node 脚本的调
阅读全文
摘要:在command 命令运行ifconfig之后,出现很多名词 lo0 gif0 stf0 en0 fw0 en1 vmnet1 查查看 lo0 = loopback gif0 = Software Network Interface stf0 = 6to4 tunnel interface en0
阅读全文
摘要:在开发或生产环境中,我们经常会搞一套自动化部署方案(俗称一键部署)。比较流行的一种就是Gitlab+Jenkins实现方案,不过这种方案占用内存比较大,没有个8G内存,很难流畅运行,而且部署起来也不快。最近发现一款神器Drone,轻量级CI/DI工具,结合Gogs使用内存占用不到1G,几行脚本就能实
阅读全文
摘要:简介项目中用到获取图片的原始尺寸,然后适配宽高;网上的大部分前端解决方案,都是new Image()后,在onload事件中获取image的尺寸。在图片数量较多的时候,这样的获取效率实在是低下。所以就有了这篇文章。通过直接读取解析文件的字节码来获取图片的尺寸。 IMAGE_HEAD_SIGS var
阅读全文
摘要:在编写网站的时候,或多或少都会用到一些网络上的字体,CSS 3 中虽然加入了对 Web Fonts(网络字体)的支持,但是浏览器对它们的加载和默认处理方式会极大的影响网站的性能和用户体验。例如默认情况下,在 Web Fonts 加载时,使用该字体的地方会显示空白,直到字体下载完成之后才会显示,这时通
阅读全文
摘要:前言 Chrome 浏览器的 Performance 面板为我们提供了检测页面性能的能力,但其提供的远不止一些性能数据。本文将从工作原理的视角,结合实际工程的录制结果,探一探性能面板向我们透露的其他信息。 性能面板 关于面板的功能与使用方法,可以参考这篇文章。本节主要介绍浏览器架构与性能面板的关系。
阅读全文
摘要:前言 本文会介绍浏览器中帧(Frame)的概念,它的流程是怎么样的。 至于写这个文章的出发点在于,我好奇浏览器中像素工作流程是怎么样的,什么时候开始的,最后的结果是什么。 基于这些好奇,查阅了些外文资料,本文提供了些参考,参考链接在文末。 缘由 在将帧的概念前,我们得从背景开始看起,也就是渲染页面的
阅读全文
摘要:本文首发于 https://github.com/whxaxes/blog/issues/10 背景 jscodeshift 是 fb 出的一个 codemod toolkit,基于 recast 这个 js 解析器封装了不少方便使用的工具方法。可是因为官网对使用方式的描述有点谜,刚用起来会有点蛋疼
阅读全文
摘要:lottie是一个跨平台的动画库,通过AE(After Effects)制作动画,再通过AE插件Bodymovin导出Json文件,最终各个终端解析这个Json文件,还原动画。本文中我只介绍前端用到的库lottie-web。 对比三种常规的制作动画方式 Png序列帧 2.Gif图 前端Svg API
阅读全文
摘要:在工作中会经常遇到一些mongodb的聚合操作,特此总结下。mongo存储的可以是复杂类型,比如数组、对象等mysql不善于处理的文档型结构,并且聚合的操作也比mysql复杂很多。 注:本文基于 mongodb v3.6 目录 mongo与mysql聚合类比 aggregate简介 aggregat
阅读全文
摘要:Awk命令是处理数据的强大工具。它获取输入数据,对其进行操作,并在标准输出中给出结果。可以对文件的行和列执行各种操作。 要有效地处理数据,了解“awk”命令的基本要素是非常重要的,这篇文章将涵盖“awk”命令的关键特性。让我们先检查语法: $ awk [options] [file] 下表列出了一些
阅读全文
摘要:今天我们来谈谈什么是Nginx? 什么是Nginx? Nginx代码完全用C语言从头写成,已经移植到许多体系结构和操作系统,包括:Linux、FreeBSD、Solaris、Mac OS X、AIX以及Microsoft Windows。 Nginx有自己的函数库,并且除了zlib、PCRE和Ope
阅读全文
摘要:关于mongodb的高级操作,包括聚合、主从复制、分片、备份与恢复、MR。 一、聚合 aggregate聚合(aggregate)主要用于计算数据,类似sql中的sum()、avg() 语法: db.集合名称.aggregate([{管道:{表达式}}]) 管道:管道在Unix和Linux中一般用于
阅读全文
摘要:学习本文的前置知识: React每次更新都会从rootFiber(根Fiber节点)向下深度优先遍历 JSX在编译时会变为React.createElement,在组件render时会调用该方法。 30秒速答: 知乎首页是React写的,我们可以覆写React.createElement方法,在运行
阅读全文
摘要:现如今的 Web,HTTPS 早已经成为标配,公开的 HTTP 网站已经和 Flash 一样,慢慢在消亡了。 启用 HTTPS 的核心是一个叫做 证书 的东西。不知道大家是否有留意,前几年上 12306 的时候,浏览器都会提示「您的链接不是私密链接」,这其实就是因为 12306 的证书有问题。如果点
阅读全文