原文地址

 

 

webpack

最近,项目用了 React,配套使用了 Webpack,毕竟热替换(react-hot-loader)吸引力确实高,开发模式下使用 webpack 构建其实也够用,并且相对 gulp-webpack 来说,模块的编译等待时间大大缩小,这是生命啊! 发布时,借助 gulp 来进行其他方面的处理,如合图,打包等。或许把这些边幅修一修、支持下,Webpack 估计就要逆天了吧?

 

Hey async, await me
In JavaScript,Web开发 on 2015年12月18日 by view: 3,543
5

背景

笔者在前面的文章介绍过如何使用generator来解决callback hell,尽管现在多数浏览器特别是移动端浏览器还不支持该ES2015新特性,但你可以通过Babel等转换工具转化成ES5兼容的等效代码,从而在生产环境使用。

不过使用generator来解决callback hell似乎有点不务正业,毕竟generator是生成器,属于Iterator的一种,设计之初是用来生成一种特殊的迭代器的。

另外还有两点也可以算是generator解决callback hell问题的缺陷:

  1. generator需要从generator function执行得到,而generator function执行之后只会返回一个generator,不管里面是怎样的代码,与我们通常对函数的认知存在差异
  2. 如果想执行generator function的函数体,需要不断调用返回的generator的next方法,这样就决定了必须依赖cobluebird.coroutine等其他辅助代码或者手动执行next,来保证generator不断next下去

Tips:文章ES6 Generator介绍有介绍generator和generator function,以及它们之间的关系和区别。

上一篇文章从setTimeout说事件循环模型》从setTimeout入手,探讨了Javascript的事件循环模型。有别于Java/C#等编程语言,Javascript运行在一个单线程环境中,对setTimeout/setInterval、ajax和dom事件的异步处理是依赖事件循环实现的。作为一个转向Javascript的开发人员,很自然的产生一个疑问,如何实现Javascript多线程编程呢?随着学习的深入,我了解到HTML5 Web Worker,本文将分析Web Worker为Javascript带来了什么,同时带大家看看worker模型在其他语言的应用。

背景

为什么是React?

React今年在国内特别火,一时间虚拟DOM(Virtual DOM)等酷炫概念一下刷新了很多前端开发同学的三观,关于性能优劣的争论也在知乎上看到不少。不得不说React解决了一些前端项目开发的痛点,而我最近的一年多的工作重心,都在兴趣部落这样一个基于兴趣社交的web产品上,有很多感同身受的地方。兴趣部落这个产品从初期只有移动端的2、3个页面,发展到现在50+移动页面,加上PC版的最近上线,中间经历了从2-3人的小项目到10+人团队的大型前端项目的巨大转变。这个过程中除了人员相对业务的线性增加,代码量、维护成本也是以指数速度增长的,很快代码臃肿、难以维护与测试等问题就凸显出来。虽然内部经过一些轻量的重构优化,但开发模式还是与高度的迭代节奏很不匹配。这时候,React+Webpack的组件开发模式让我眼前一亮,暗下决心要让这样的先进开发模式推广到项目团队,好东西一定要让大家有所受益,而不仅仅是技术的尝鲜、摆设。

为什么尝试使用Canvas绘制列表?使用canvas绘制列表的好处在于页面只有一个dom元素,这样对于大量dom元素组成的列表来说,无疑更节省页面内存。

本文将一步一步分析,如何实现一个canvas绘制的长列表。

 

Step1:dom节点映射

首先考虑一个问题,对于我们在页面中常见的dom结点,在Canvas中如何表示?

因此我们的第一步工作就是实现dom结点到Canvas绘制对象的映射

前言

Facebook 在2015.9.15发布了 React Native for Android,把 JavaScript 开发技术扩展到了移动Android平台。基于React的React Native 让前端开发者使用 JavaScript 和 React 编写应用,利用相同的核心代码就可以创建 基于Web,iOS 和 Android 平台的原生应用。在React Native for Android出来之后,本人花了些时间从环境搭建到做出几个demo,从体验来看都挺流畅,具体将此间遇到和问题和具体的新的体会,向大家分享一下。

作为一个从其他编程语言(C#/Java)转到Javascript的开发人员,在学习Javascript过程中,setTimeout()方法的运行原理是我遇到的一个不太好理解的部分,本文尝试结合其他编程语言的实现,从setTimeout说事件循环模型

原文地址

 

继 Facebook 提出 Flux 架构来管理 React 数据流后,相关架构开始百花齐放,本文简单分析 React 中管理数据流的方式,以及对 Redux 进行较为仔细的介绍。

        作为一只网瘾少女,各种酷炫的网页效果已经不能再引起我的注意了,直到有一天我看到了这个http://matthew.wagerfield.com/parallax/ ,瞬间晕船了。嗯,我喜欢这种微醺的感觉。这时我的脑洞突然开了一下,想起了前段时间票圈疯转的各种360°全景摄影。当手机绕着你360°转动的时候,就好像置身照片中的场景一样,那这个框架应该可以做成这样的效果~(虽然后来知道这个效果并不是用parallax.js做的sad)。于是开启了我用parallax.js来变身炫酷少女之路。

 

Parallax.js到底干嘛的

为什么先讲数组


数据结构可以简单的被分为线性结构和非线性结构。

线性结构大致包括:

  1. 数组(连续存储);
  2. 链表(离散存储);
  3. 栈(线性结构常见应用,由链表或数组增删和改进功能实现);
  4. 队列(线性结构常见应用,由链表或数组增删和改进功能实现);

非线性结构大致包括:

  1. 树;
  2. 图;

其中,数组是应用最广泛的数据存储结构。它被植入到大部分编程语言中。由于数组十分容易懂,所以它被用来作为介绍数据结构的起点非常合适。