换种方式读源码:如何实现一个简易版的Mocha

作者:黄浩群

前言

Mocha 是目前最流行的 JavaScript 测试框架,理解 Mocha 的内部实现原理有助于我们更深入地了解和学习自动化测试。然而阅读源码一直是个让人望而生畏的过程,大量的高级写法经常是晦涩难懂,大量的边缘情况的处理也十分影响对核心代码的理解,以至于写一篇源码解析过后往往是连自己都看不懂。所以,这次我们不生啃 Mocha 源码,换个方式,从零开始一步步实现一个简易版的 Mocha。

我们将实现什么?

  • 实现 Mocha 框架的 BDD 风格测试,能通过 describe/it 函数定义一组或单个的测试用例;
  • 实现 Mocha 框架的 Hook 机制,包括 before、after、beforeEach、afterEach;
  • 实现简单格式的测试报告输出。

TypeScript安利指南

作者:李逸君

骚年,你感受过debug一年找不到问题,最后发现是变量名写错时的绝望吗?
骚年,你感受过生产线上代码出现Uncaught TypeError时的恐惧吗?
骚年,你感受过写代码找一万个文件还找不到方法定义时委屈吗?

拿起键盘,让我们对谋害生命的代码拖进垃圾箱!(划掉)

前言

据了解,目前有相当一部分同学不想去学习ts,毕竟没(xue)时(bu)间(dong)。很不幸两个月前我也是其中的一员。在看到尤大大都用ts写vue3了,蠢蠢欲动的我小心翼翼的踏入了这个深坑。在经历了长达一天的摸爬滚打之后,领悟到了真谛

记一次Node.js直出服务的性能优化

作者:肖睦群、李刚松

一.问题背景

MPM(Market Page Maker)是京东社交电商部的组件化的页面可视化搭建平台,于2016年9月份上线,平均每周150+个页面,目前已经成为社交电商部的一个核心系统。系统使用Vue.js作为组件化的基础框架,并于2017年5月份上线了Node.js直出服务。MPM的页面会被运营同学拿到各种渠道投放,整体流量很不稳定,对于流量的暴涨情况要能够及时处理,这对于开发同学来说是一个比较烦的工作。

前几天突然收到告警信息,由于运营同学将某个MPM活动页面投放了外部广告,直出服务流量大涨,服务器CPU使用率达到了80%以上,于是立马申请扩容,问题虽解决,但是留给了我们一个问题:直出服务能否优化,这次量级的流量进来之后,是否可以稳定支撑而不需要扩容?

前端资源治理(一)

作者:李刚松

0.也谈前端工程化

随着前端技术的飞速发展,前端需要一种更加工程化的方式解决前端开发日益复杂的问题。前端工程化本质也是软件工程的一种,由于软件工程并无严格的定义(或者说缺乏统一的定义),因此前端工程化的内涵其实相当宽泛,一般来说,前端工程化重点关注的是研发和维护效率,所有最终目的是这个的,都可以算作前端工程化的范畴。
前端工程化近几年也是技术热点,基本上大型前端技术交流会议都有此专题,从规范、组件、编译及构建、工作流、持续集成、监控等多个维度都有涉及,笔者尝试从前端资源治理的角度谈一下前端工程化,本文是系列文章的第一篇,主要讲问题及解决的思路,不涉及具体的实现细节。

你还在用图片做引导蒙层?

作者:深山蚂蚁

引导蒙层通常在新业务上线、或者业务有变更时的给新用户的一个操作指引。下图页面即是一个蒙层,会在某个局部位置高亮我们需要重点突出的内容:

【译】Web内容如何影响电池的使用

原文地址:https://webkit.org/blog/8970/how-web-content-can-affect-power-usage/
原文作者:Benjamin Poulain & Simon Fraser
译者:刘辉 校验:李刚松

现在用户上网大多使用移动设备或者笔记本电脑。对这两者来说,电池寿命都很重要。在这篇文章里,我们将讨论影响电池寿命的因素,以及作为一个web开发者,我们如何让网页耗电更少,以便用户有更多时间来关注我们的内容。

是什么在耗电?

移动设备的电力消耗有以下几个因素:

  • CPU (核心处理器)
  • GPU (图形处理)
  • 网络 (wifi或者蜂窝移动网络)
  • 屏幕

屏幕功耗相对稳定,并且主要由用户控制(通过屏幕使用时间和亮度),但是对于其他组件,例如CPU,GPU,网络模块,功耗是动态变化的,而且变化范围很大。

手把手教你写webpack loader

作者:黄浩群

一、什么是 loader

loader 和 plugins 是 webpack 系统的两大重要组成元素。依靠对 loader、plugins 的不同组合搭配,我们可以灵活定制出高度适配自身业务的打包构建流程。

loader 是 webpack 容纳各类资源的一个重要手段,它用于对模块的源代码进行转换,允许你在 import 或加载模块时预处理文件,利用 loader,我们可以将各种类型的资源转换成 webpack 本质接受的资源类型,如 javascript。

【译】在生产环境中使用原生JavaScript模块

原文地址:https://philipwalton.com/articles/using-native-javascript-modules-in-production-today/
原文作者:PHILIP WALTON
译者:龚亮 ,校对:刘辉
声明:本翻译仅做学习交流使用,转载请注明来源

两年前,我写了一篇有关module/nomodule技术的文章,这项技术允许你在编写ES2015+代码时,使用打包器和转换器生成两个版本的代码库,一个具有现代语法的版本(通过<script type="module">加载)和一个使用ES5语法的版本(通过<script nomodule>加载)。该技术允许你向支持模块(译者注:指ECMA制定的标准的export/import模块语法及其加载机制,又称为ES Module、ESM、ES6 Module、ES2015 Module,下文中将出现很多”模块”一词,都是这个含义)的浏览器发送更少的代码,现在大多数Web框架和CLI都支持它。

Javascript抽象语法树下篇(实践篇)

作者:陈晓强

上篇已经对AST基础做了介绍,本篇介绍AST的运用

AST应用的三个要点

  1. 需要一个解析器,将代码转换为AST
  2. 需要一个遍历器,能够遍历AST,并能够方便的对AST节点进行增删改查等操作
  3. 需要一个代码生成器,能够将AST转换为代码

Javascript抽象语法树上篇(基础篇)

作者:陈晓强

一、基础

为什么要了解抽象语法树

日常工作中,我们会碰到js代码解析的场景,比如分析代码中require了哪些包,有些什么关键API调用,大部分情况使用正则表达式来处理,可一旦场景复杂,或者依赖于代码上下文时,正则就很难处理了,这时候就要用到抽象语法树。常见的uglify、eslint、babel、webpack等等都是基于抽象语法树来处理的,如此强大,有必要好好了解一下。

Your browser is out-of-date!

Update your browser to view this website correctly. Update my browser now

×