Taobao FED

分类:Web开发

Rax 系列教程(长列表)

引子Rax 提供的长列表标签有很多,在什么场景下使用什么列表组件,怎样选择列表组件性能会更好,这些问题可能会给刚接触 Rax 的同学带来困扰。本文结合 Rax 0.5 发布版本对列表能力进行一次详细的梳理。 如何让页面滚动在开始正题之前先说说为什么要有长列表的概念,以及如何让页面可以滚动。 传统的 Web 页面天生在浏览器里就是可以滚动的,我们额外引入一个滚动容器的概念好像比较多余。但当我们做跨

G3D —— Hybrid 环境下的 WebGL 3D 渲染引擎

G3D 是一款基于 WebGL 的 JavaScript 3D 渲染引擎,借助 GCanvas,G3D 可以运行在 Weex,ReactNative 等 hybrid 环境下。G3D 由淘宝终端团队推出,并于 2018 年 3 月与 GCanvas 同时宣布正式开源。 那么就会有同学问了,G3D 和 three.js 有什么不同呀?G3D 和 GCanvas 究竟是什么关系啊?这篇文章,就聊一聊

Rax 系列教程(native 扫盲)

引子Rax 天生就是一个跨容器的解决方案,这让我们不必单独了解 iOS 和 安卓背后做了什么,让我们的开发变得很省心。但真实情况是我们的业务往往同时跑在 web 和 native 两端,web 我们轻车熟路是前端天生的优势,native 对很多人来说就会有些陌生,native 上出现的各种问题用 web 的路子去解释往往会解释不通。据 2017 年底粗略统计 Rax 的用户 70% 是前端同学,

Rax 系列教程(上手)

引子这篇文章针对初学 Rax 的同学,主要介绍 Rax 是什么,开发体验的梳理,以及遇到 Rax 的开发问题如何寻求解决。本文配合 Rax 的 0.5 发布版本推出,结合新版 Rax 对于旧版的教程内容做出部分修正。 1、什么是 Rax Rax 是一个源自淘宝的开源项目 https://github.com/alibaba/rax 作为 Weex 的上层 DSL 在集团内有广泛的应用。 除了跨

如何实现一个 Git Diff 解析器

代码审阅中一个重要功能是对两个 commit 进行 diff 并展示到页面中,这篇文章将尝试总结其实现过程。 解析 Git Diff想要展示 diff,首先需要将 Git 提供的 diff 格式解析成结构化数据(比如:JSON)。 基本格式一个基本的 Git Diff 格式如下: 12345678910111213diff --git a/f1 b/f1index 6f8a38c..449b07

使用 ES decorators 构建一致性 API

重用和一致性是程序设计中经久不衰的两个课题。在最新的 ES Proposal 中,「decorators 语法」为此带来了一定的便利,并且,很适合应用于大型的类库中。 装饰模式提到 decorator 大家都不会陌生,即「装饰模式」—— 我们可以在「不侵入原有代码」的情况下,为代码增加一些「额外的功能」。 所谓「额外的功能」一般都比较独立,不和原有逻辑耦合,只是做一层包装。你也可以把它看成「包

「深入实践中的 Node.js」- Node 地下铁第四期南京站线下沙龙总结

前言获得知识有两种途径。一是学习理论知识;二是实践。二者缺一不可。学习知识固然重要,但最根本的是要把理论的知识和实践结合起来达到学以致用和用以促学的目的,Node.js 从 2009 年至今发展已近 8 年,时光荏苒,回想当初社区生态还不完善时候的捉襟见肘,到现在社区庞大社区完善,为一些企业打造了了不起的线上应用。 三月春盛,烟烟霞霞,Node.js 地下铁以深入实践为主题迎来了第四场活动,大家

我眼中的 JavaScript 函数式编程

JavaScript 函数式编程是一个存在了很久的话题,但似乎从 2016 年开始,它变得越来越火热。这可能是因为 ES6 语法对于函数式编程更为友好,也可能是因为诸如 RxJS (ReactiveX) 等函数式框架的流行。 看过许多关于函数式编程的讲解,但是其中大部分是停留在理论层面,还有一些是仅针对 Haskell 等纯函数式编程语言的。而本文旨在聊一聊我眼中的函数式编程在 JavaScri

认识 TypeScript

这是一个系列文章,一共会有三篇: [本篇] 认识 TypeScript - 简单描述 TypeScript 的定位、特点。 TypeScript 语法学习 - 比较文档化的讲述 TypeScript 的使用方式。 TypeScript 工程使用 - 讲述如何在工程 —— 包括 Node.js 工程、React 工程 —— 中应用 TypeScript。 最近几个月有幸体验了 TypeScri

浅析 requestAnimationFrame

相信现在绝大多数人在 JavaScript 中绘制动画已经在使用 requestAnimationFrame 了,关于 requestAnimationFrame 的种种就不多说了,关于这个 API 的资料,详见 http://www.w3.org/TR/animation-timing/,https://developer.mozilla.org/en/docs/Web/API/window.