最大的不同在于你会更多地考虑用户。设计的时候，一开始总是问：我为谁设计？他们需要什么？比如，优秀的建筑师不会先设计，然后强迫用户接受，而是先研究最终用户的需求，然后做出用户需要的设计。

但真正令人惊恐的是，流行一时的不仅有衣服，还有道德观念。明明是专横武断、毫无依据的错误观点，但是大多数人却深信不疑，受到影响而不自知。这是非常危险的。

现在流行“相对主义”，即认为真理是相对的。即使你已经从小孩变成了成年人，这种观点依然可能妨碍你思考“品味”。把品味说成个人的偏好可以有效地杜绝争论，防止人们争执哪一种品味更好。但是问题是，这种说法是不正确的。只要你自己开始动手设计东西，就能明白这一点。

很可能你使用过 Windows/Dos 下用于文件查找的通配符(wildcard)，也就是 * 和 ? 。如果你想查找某个目录下的所有的Word文档的话，你会搜索 *.doc。在这里，* 会被解释成任意的字符串。和通配符类似，正则表达式也是用来进行文本匹配的工具，只不过比起通配符，它能更精确地描述你的需求 —— 当然，代价就是更复杂——比如你...

CDN（内容分发网络）全称是 Content Delivery Network，建立并覆盖在承载网之上、由分布在不同区域的边缘节点服务器群组成的分布式网络，替代传统以 WEB Server 为中心的数据传输模式。

从收到 HTML、CSS 和 JavaScript 字节到对其进行必需的处理，从而将它们转变成渲染的像素这一过程中有一些中间步骤，优化性能其实就是了解这些步骤中发生了什么， 即关键渲染路径。优化关键渲染路径是指优先显示与当前用户操作有关的内容。

与桌面应用不同，网络应用不需要单独的安装过程：只需输入网址，便可启动和运行 - 这是网络的一个关键特色。不过，要做到这一步，我们通常需要获取几十个（有时甚至是几百个）不同的资源，所有这些资源加起来的数据量高达几兆字节，并且必须在短短几百毫秒内汇聚起来，以实现我们想要达到的即时网络体验。

RAIL 简介 RAIL 是一种以用户为中心的性能模型。每个网络应用均具有与其生命周期有关的四个不同方面，且这些方面以不同的方式影响着性能： RAIL核心思想是以用户为中心；最终目标不是让您的网站在任何特定设备上都能运行很快，而是使用户满意。主要包含以下几个方面： 立即响应用户；在 100 毫秒以内确认用户输入。 设置...

React在减少重复渲染方面确实是有一套独特的处理办法，那就是虚拟DOM，但显然在首次渲染的时候React绝无可能超越原生的速度，或者一定能将其它的框架比下去。尤其是在优化前的React，每次数据变动都会执行render，大大影响了性能，特别是在移动端。

随着前端这几年的风生水起，CSS作为前端的三剑客之一，各种技术方案也是层出不穷。从CSS prepocessor（SASS、LESS、Stylus）到后来的后起之秀 PostCSS，再到 CSS Modules、Styled-Component 等。有人维护了一份完整的 CSS in JS 技术方案的对比，里面已经有将近50种技术方案。CSS Modules就是其中一种。

React 因为性能好而被广为周知，但这并不意味着我们能够把这个当作是理所当然。让你的React应用更快的关键Tips之一就是优化你的 render 函数.

文章同步于Github Pines-Cheng/blog 简介 本质都是为了解决异步action的问题 Redux Saga可以理解为一个和系统交互的常驻进程，其中，Saga可简单定义如下： {代码...} saga特点： saga的应用场景是复杂异步，如长时事务LLT(long live transcation)等业务场景。 方便测试，可以使用takeEvery打印logger。 提供takeLatest/t...

meta常用于定义页面的说明，关键字，最后修改日期，和其它的元数据。这些元数据将服务于浏览器（如何布局或重载页面），搜索引擎和其它网络服务。

相关字段简述 RFC2616规定的47种http报文首部字段中与缓存相关的字段。 通用头部字段 请求头部字段 响应头部字段 实体头部字段 Pragma与Expires 在 http1.0 时代，给客户端设定缓存方式可通过两个字段——Pragma和Expires来规范。虽然这两个字段早可抛弃，但为了做http协议的向下兼容，你还是可以看到很多网站依旧会带上这...

分层架构是最常见的架构，也被称为n层架构。多年以来，许多企业和公司都在他们的项目中使用这种架构，它已经几乎成为事实标准，因此被大多数架构师、开发者和软件设计者所熟知。比如MVC。

在前端工程的的打包史中，common文件向来都不是一个好处理的方面。在这一块，webpack提供了CommonsChunkPlugin来处理这个事情，但是在由于文档的模棱两可，再加上各种配置选项的多样性和某些bug，还是有不少坑的。

缩写 遵循通用规范，只使用显而易见的缩写，不要滥用，不要有歧义。 变量名 常用缩写 application app arguments args average avg address addr authority / authorize auth attribute attr asynchronization asyn button btn buffer buff command cmd compare cmp calculate calc calendar cal character char delete ...

前言 我们不考虑需求的合理性，边界等，仅仅从前端的角度规避一些常见的交互设计或体验的问题，目标只有一个：保质准时上线，不给团队挖坑。 需求文档不需要多么高保真，重点关注: 逻辑是否清晰 各个状态是否考虑周全 表达是否有歧义 新功能是否存在关联功能的改造 这只是第一版，后面将根据实际情况持续更新。。。 设计...

Git 每次提交代码，都要写 Commit message（提交说明），否则就不允许提交。但是，一般来说，commit message 应该清晰明了，说明本次提交的目的。

作为一名前端从业者，Chrome-devtools是最常用的工具之一。以前一直还觉得自己的这一块还是比较熟悉的，结果偶然看到了Chrome-devtools的文档之后，才发现还有这么多强大、炫酷，但是相对冷门的用法，觉得有必要来一次梳理和总结。

个人在学习Git工作流的过程中，从原有的 SVN 模式很难完全理解Git的协作模式，直到有一天我看到了下面的文章，好多遗留在心中的困惑迎刃而解：

快捷键 r快速引用 你可以选中别人的评论文字，然后按r，这些内容会以引用的形式被复制在文本框中： t：搜索文件 s：光标定位到搜索窗口 w：选择分支 g n Go to Notifications g d Go to Dashboard g c Go to Code g i Go to Issues g p Go to Pull Requests g w Go to Wiki ?：如果要查看所有的快捷键，可以在键盘上按下...

把搜索词放在双引号中，代表完全匹配搜索，也就是说搜索结果返回的页面包含双引号中出现的所有的词，连顺序也必须完全匹配。bd和Google 都支持这个指令。例如搜索： “seo方法图片”

Git 和 Github 秘籍，灵感来自于 Zach Holman 在 2012 年 Aloha Ruby Conference 和 2013 年 WDCNZ 上所做的演讲：Git and GitHub Secrets(slides) 和 More Git and GitHub Secrets(slides)。

stylelint 是一个基于 Javascript 的代码审查工具，它易于扩展，支持最新的 CSS 语法，也理解类似 CSS 的语法。此外，因为它是基于 JavaScript，所以比起 Ruby 开发的 scss-lint 速度更快。

体验优化类 上网必备 Speed dial plus 自定义新标签页， 直接替换掉chrome自带的毫无新意的新标签页，简洁优美快速，我本人非常喜欢。 广告屏蔽ublock origin 不仅可以智能识别屏蔽，还可以手动添加广告块。 开发类 程序员必备工具Fehelper 各种转码、时间戳、json格式化、代码格式化、代码压缩、二维码生成，web开发神...

来自于Airbnb React/JSX 中文编码规范 Airbnb React/JSX 编码规范 算是最合理的React/JSX编码规范之一了 Basic Rules 基本规范 每个文件只写一个模块. 但是多个无状态模块可以放在单个文件中. eslint: react/no-multi-comp. 推荐使用JSX语法. 不要使用 React.createElement，除非从一个非JSX的文件中初始化你的app. 创建...

命令行 查看git上的个人代码量： {代码...} 结果示例：(记得修改 username) {代码...} 统计每个人增删行数 {代码...} 结果示例 {代码...} 查看仓库提交者排名前 5 {代码...} 贡献值统计 {代码...} 提交数统计 {代码...} 添加或修改的代码行数： {代码...} 使用gitstats GitStats项目，用Python开发的一个工具，通过封装G...

不必严格遵守本文的所有原则，有时少遵守一些效果可能会更好，具体应根据实际情况决定。这是根据《代码整洁之道》作者多年经验整理的代码优化建议，但也仅仅只是一份建议。

初学者对React可能满怀期待，觉得React可能完爆其它一切框架，甚至不切实际地认为React可能连原生的渲染都能完爆——对框架的狂热确实会出现这样的不切实际的期待。让我们来看看React的官方是怎么说的。React官方文档在Advanced Performanec这一节，这样写道：