• 记一次 ESlint 的经历

    记一次 ESlint 的经历 背景 准备重构 tingle 这个项目,首先就是进行了 Button 这个组件的重构以便熟悉熟悉项目。 tingle 采用 gulp + webpack 对代码进行实时编译开发和构建,在目前这个项目中,现有工具不具备代码质量的校验,这样非常不利于项目日后的社区化贡献代码和标准化,因此在这次重构中,决定将 js 的代码质量检查加进去,本来想使用 jshin

  • nginx 配置允许 CORS

    nginx 配置允许 CORS 后端工程师写完接口之后传到远程服务器上,为了便于本地调试,我特地去服务器上的nginx配置允许CORS。 配置过程 服务必须返回 Access-Control-Allow-Origin : enabledhost.com 的 http response,才会允许跨域访问,我先去服务器上找到 nginx 的配置文件,然后直接配置以下内容: code完

  • Meteor 全端框架初识

    Meteor 全端框架初识 简介 Meteor 是一个极其简单的纯JS全栈式框架,后端就是 Node.js 和 Mongodb,可以用来开发 web 和 app,app 的话就是以 WebView 的形式,然后 cordova 打包,Metetor 提供详细的命令行工具来实现APP的开发和构建。 官方声称它可以将过去几天甚至几周的工作缩减到几个小时内完成,今天笔者就简单了解一下这个框

  • Shadow DOM

    Shadow DOM 最近在尝试做公司的前端组件化,采用自创的CBC(Classname Based Components)模式。今天学习了一下 Web Components 规范的其中一个组成部分,Shadow DOM,也算为今后的组件化之路进行铺垫吧。 什么是 Shadow DOM? Shadow DOM 在我们开发组件的时候弥补了DOM树封装性不足的缺点。通过Shadow DOM,

  • 用Flux的思想写前端

    用Flux的思想写前端 最近用React开发了公司的一个产品,写完之后发现代码特别乱且较难维护,早就得知Facebook设计了一个新的开发模式——Flux,今天就实践一下Flux的开发模式,体会体会久违的新鲜感。 Flux Flux是一个全新的开发模式,与传统的MVC不同,Flux的设计中心是单向数据流。Flux有三个主要部分:Stores, Views(React组件), Dis

  • 拥抱ES6,再谈ES5原型继承

    拥抱ES6,再谈ES5原型继承 初衷 最近,ES6被多次曝光在JS界内,ES6有很多新特性,这让笔者产生了学习的欲望,因为ES6是下一代的JavaScript,感觉会在2年之内迅速普及起来,因此笔者打算开始进行ES6的学习,那么先学哪个特性比较重要呢? 其实在任何系统或者业务的设计中,代码层面的设计都离不开面向对象和设计模式,因此类和继承就是首当其冲需要研究的范畴,ES6提供了简单的cl

  • 近期移动端开发经验整理

    近期移动端开发经验整理 zepto的tap事件 tap的事件由于是委托自body,所以有很大诟病,很容易在延迟之后造成“点透”现象,可以采用fastclick代替。 React onTouchEnd问题 react上一个元素onTouchEnd点击之后alert弹出框,有可能会触发两次。 iOS的position:fixed错误 经过验证,此问题在多个版本中都存在,尤其是UIWeb

  • 「无限加载更多」带来的性能瓶颈

    「无限加载更多」带来的性能瓶颈 引子 相信很多前端都遇到过这样的需求,在一个页面中预加载一个列表数据,当浏览器滚动到底部之后加载更多数据,然后循环往复这个操作。不知道大家有没有想过这个问题,设备的内存是有限的,而操作系统分配给每一个程序的内存资源也是有限制的,假如我们一直把这个列表加载下去,会出现什么样的问题? OK,我遇到问题了 其实我发现这个加载更多带来的性能瓶颈,并不是从加载更多

  • React.js 要点

    React.js 要点 最近在公司的一个移动端WEB产品中使用了React这个框架(并不是React-Native),记录一下在开发过程中遇到的各种问题以及对应的解决方法,希望能对读者有所帮助。 React原则 React不多做介绍,就是Facebook的一个开源JS框架,专注的层面为View层,不包括数据访问层或者那种Hash路由(不过React有插件支持),与Angularjs,

  • JavaScript Array 整理 - 元素操作

    JavaScript Array 整理 - 元素操作 前篇整理了一些Array常用的遍历操作方法,今天再整理一下Array对象中针对元素操作的方法。 分别是: concat (组合数组) join(数组转字符串) pop(删除最后一个元素) shift(删除第一个元素) push(在数组尾部添加新元素) unshift(在数组头部添加新元素) slice (不改变数组本身