Taobao FED

主页

Webkit 远程调试协议初探

任何做过 Web 开发的同学,都避免不了在浏览器内进行调试。而大部分同学的首选工具,就是 Chrome DevTools。DevTools 本身我们无需多说,是一个大家不能再熟悉的工具了。但是埋藏在 DevTools 下面的开放协议以及它赋予的众多可能性,至今仍未见到充分的剖析和应用。 Webkit 的远程调试协议是 Webkit 在 2012 年引入的。目前所有 Webkit 内核的浏览器都支

yield 和 yield*

最近在看 koa 的中间件实现时,总是看到 yield* next 这种用法,觉得很困惑。下面是学习成果。 代理 yield我们先来看看原生语法中,代理 yield(delegating yield)的含义和用法。 首先是下面的代码(普通的 yield): 123456789101112131415161718192021function* outer() { yield 'be

使用 JS 构建跨平台的原生应用:React Native for Android 初探

Facebook 于 2015 年 9 月 15 日推出 React Native for Android 版本。相比起 for iOS,for Android 跑 “Hello, World!” 折腾了不少。在这些复杂的环境、工具依赖里,我们可以看出 React Native for Android 的一些端倪。 本系列文章就以开发一个 “Hello, World!” 的 App 为线索,跟大

管理 node 版本,选择 nvm 还是 n?

很多同学在选择 node 的版本管理工具时,可能第一时间就直接使用了 nvm,一般不会再去调研另一个工具 n,更没有闲情去了解这两者的特性和差异。毕竟工具能用就行,没必要搞清其运作机制。 是的,我也不例外,然而直到有一天…… 引子我本机安装着 nvm,而 node 本来一直运行在 0.x 的老版本上。后来为了跑 ES6,我将 node 切换到 4.x 的版本,并且把老版本给删掉了。 然后我就碰

ES7 Decorator 装饰者模式

1、装饰模式设计模式大家都有了解,网上有很多系列教程。 这里只分享 装饰者模式 以及如何使用 ES7 的 decorator 概念。 1.1、装饰模式 v.s. 适配器模式装饰模式和适配器模式都是 包装模式 (Wrapper Pattern),它们都是通过封装其他对象达到设计的目的的,但是它们的形态有很大区别。 适配器模式我们使用的场景比较多,比如连接不同数据库的情况,你需要包装现有的模块接口

在 iOS 模拟器中调试 Web 页面

双十一大家“买买买”了吗?我猜你们要么是躺在沙发上,要么是躲在被窝里用手机和 Pad 下的单,因为我就是这么干的。当然我也不是瞎猜,天猫官方微博公布的数据为证:无线端交易额占比一路保持在 70% 以上,最后定格在 68%(据说峰值数据更是丧心病狂,具体数据未公布,大家猜猜吧)。 “Mobile First” 真的已经不是喊喊口号而已!部分业务形态甚至直接 “Mobile Only” 了。当然所谓

HTML 压缩服务治理

缘由笔者最近在研究如何实现页面 HTML 及内联 JS/CSS 的实时压缩功能。 首先笔者尝试了在前端模块中扫描内联的 JS/CSS 并压缩,这样还可以集成至前端模块的上传工具中。观察了一段时间发现这样无法处理模板中的 JS/CSS,造成很多遗漏的 JS/CSS 不能压缩。 于是笔者转而考虑对页面进行实时 HTML 压缩,这次考察了坑过许多 Node.js 开发者的 html-minifier

移动端开发小记 - Flexbox

在开发移动端页面的时候,出去布局方便和减少代码量的考虑,使用了 Flexbox 的布局方式,在其中也遇到了一些问题,简单记录下。 什么是 Flexbox说到 Flexbox,大家应该都不陌生,网络上也有 N 多的教程。但是在这里还是简单说一下,就当回顾知识了吧。 CSS 2.1 定义了四种布局模式 ― 由一个盒与其兄弟、祖先盒的关系决定其尺寸与位置的算法: 块布局 ― 为了呈现文档而设计出来的

当我们谈论 cluster 时我们在谈论什么(下)

上篇文章讲解了 Node.js 中多进程部署时遇到的各种问题,那么实际的线上项目中到底是如何利用多进程,如何保障各个 worker 进程稳定性的呢,又是如何利用 cluster 模块 fork 子进程,父子进程间又是如何实现通信的呢?本篇就来一一揭晓。 负载均衡回忆一下上篇中提到的最初 Node.js 多进程模型,多个进程绑定同一端口,相互竞争 accpet 新到来的连接。由于无法控制一个新的连

如何评价页面的性能

引言前端页面的性能一直都是一个热议的话题,从老早的“军规”开始我们就一直在关注页面的性能问题。 在前面巨人们的身后每个人也有自己的一些页面性能的经验,本文主要是介绍如何评估页面加载完成之后的性能。 浏览器如何渲染一个页面先附上一张图片: 这是在网上找的一张图,虽然是用来描述 performance 的 API 但是也很好的描述了浏览器是怎么处理一个页面渲染的。 这是我们在 PC 时代考虑的浏览