june01 实现一个简单的模板引擎
In JavaScript,Web开发 on 2016年10月22日 by view: 3,782
5

简介

模板引擎,其实就是一个根据模板和数据输出结果的一个工具。

我们要开发一个将模板文件转换成我们实际要使用的内容的工具,这个工具就是模板引擎。我们把模板文件里的内容当成字符串传入到模板引擎中,然后模板引擎根据一定语法对该字符串进行解析处理,然后返回一个函数,之后我们在执行函数时把数据传输进去,即可拿到根据模板和数据得到的新字符串。最后我们想怎么处理该字符串就看需求了,如果用于前端模板生成的话,则可以用dom的innerHTML这个属性来追加内容。

目前前端的模板引擎多得数不胜数,语法特性也花样百出,用行内的话来说,我们要实现的是一种基于字符串的模板引擎。

TAT.joeyguo 谈谈函数式编程 
In Web开发 on 2016年09月20日 by view: 3,548
1

原文地址

函数式编程 ( Functional Programming ) 是一种以函数为基础的编程方式和代码组织方式,能够带来更好的代码调试及项目维护的优势。本篇主要结合笔者在实际项目开发中的一些应用,简要谈谈函数式编程。

==============接上篇 Preload:有什么好处?(上)=================

译者注:上文讲到了利用Preload,我们可以做到哪些事情,从这里继续~

 

响应式加载(RESPONSIVE LOADING)

因为Preload是一个链接,遵循规范它应有media属性(目前Chrome还未支持,不过很快就可以了)。这个属性可以启用资源的条件加载能力。

它又有什么用处呢?举个例子,你的网站的初始视窗,对于PC/宽屏设备展示可交互的地图版本,而对于手机/窄屏设备则展示静态的地图版本。如果你擅于加载性能优化,会想到在特定设备只加载其中一个版本的资源,而不是所有资源。而要做到这样唯一的办法就是使用JS去动态地加载资源。但是这么做,会使得资源对于preloader(译者注:上文提到过的浏览器内部的预加载器)不可见,因此会使得资源的加载时机稍微滞后,不但影响了用户的视觉体验,还对站点的SpeedIndex 得分有着负面影响

所以我们该怎么做,才能让浏览器尽早知道所需加载的资源呢?没错,就是Preload!

我们可以使用Preload提前加载这些资源,并且使用media属性,做到只加载需要的资源:

TAT.dnt 时光倒流程序设计-AlloyTicker
In Web开发 on 2016年07月25日 by view: 3,741
3

熵与负熵

熵遵循熵增原理,即无序非热能与热能之间的转换具有方向性。薛定谔说过:生命本质在于负熵。熵代表的是无序,负熵就是熵的对立,而负熵表示的则是有序。汲取负熵(米饭、面包、牛奶、鸡蛋),可以简单的理解为从外界吸收了物质或者能量之后,转化成负熵流,使系统的熵降低,人体变得更加有序。

作为一个经常和web打交道的程序员,了解这些协议是必须的,本文就向大家介绍一下这些协议的区别和基本概念,文中可能不局限于前端知识,还包括一些运维,协议方面的知识,希望能给读者带来一些收获,如有不对之处还请指出。

 

1. web始祖HTTP

全称:超文本传输协议(HyperText Transfer Protocol) 伴随着计算机网络和浏览器的诞生,HTTP1.0也随之而来,处于计算机网络中的应用层,HTTP是建立在TCP协议之上,所以HTTP协议的瓶颈及其优化技巧都是基于TCP协议本身的特性,例如tcp建立连接的3次握手和断开连接的4次挥手以及每次建立连接带来的RTT延迟时间。

TAT.李强 Nodejs原生支持的ES6特性
In Node.js on 2016年07月04日 by view: 11,389
35

随着React的风靡,配合Webpack以及Babel等技术,越来越多的前端同学将ECMAScript 2015(ES6)的特性运用在项目中,import、export、class、箭头函数、块级作用域等特性屡试不爽。而对于Node.js实现的后台代码来说,我们也同样希望使用这些ES6特性,下面将以v4.4.4(LTS version)长期支持版本为例展开话题,从兼容性以及性能两方面着手分析Node.js对ES6的支持情况。

TAT.joeyguo Node直出理论与实践总结
In Web开发 on 2016年07月04日 by view: 4,104
14

原文地址

直出是什么?到底是怎样的性能优化?本文将结合从在浏览器输入url,到展示最终页面的过程来对其进行一步步分析,并将在手Q web 中的实际应用实践进行总结。

 

TAT.heyli 腾讯新闻React同构直出优化实践
In Web开发 on 2016年06月27日 by view: 4,736
1

原文地址
本文start kit: steamer-react

为什么做直出

就是为了“性能”!!!
按照经验来说,直出,能够减少20% – 50%不等的首屏时间,因此尽管增加一定维护成本,前端们还是前赴后继地在搞直出。

除此之外,有些特定的业务做直出能够弥补前后端分离带来的SEO问题。像这次选取的腾讯新闻,大多数页面首屏其实都是直出的(但肯定不是React直出)。

TAT.dnt kmdjs集成uglifyjs2打造极致的编程体验
In Web开发 on 2016年06月14日 by view: 1,558
1

回顾

上篇文章大概展示了kmdjs0.1.x时期的编程范式:
如下面所示,可以直接依赖注入到function里,

也可以直接在代码里把full namespace加上来调用,如:

原文地址

React 的实践从去年在 PC QQ家校群开始,由于 PC 上的网络及环境都相当好,所以在使用时可谓一帆风顺,偶尔遇到点小磕绊,也能够快速地填补磨平。而最近一段时间,我们将手Q的家校群重构成 React,除了原有框架上存在明显问题的原因外,选择React也是因为它确实有足够的吸引力以及优势,加之在PC家校群上的实践经验,斟酌下便开始了,到现在已有页面在线上正常跑起。