随笔分类 - 前端架构
摘要：介绍 众所周知，Node.js运行在Chrome的JavaScript运行时平台上，我们把该平台优雅地称之为V8引擎。不论是V8引擎，还是之后的Node.js，都是以单线程的方式运行的，因此，在多核心处理器的系统中并不能发挥其最大的性能。 Node.js的cluster模块 幸运的是，Node.js
阅读全文
摘要：webpack中的解决方案——Code Splitting,简单来说就是按需加载（下载），如果是requireJS对应的AMD的方案中这本是在正常不过了。但是在webpack中All in one的思想就会显得很怪，但webpack并不死板（就像某著名AMD和CMD模块管理器中都有对方阵营的实现方案
阅读全文
摘要：React 的核心思想是：封装组件，各个组件维护自己的状态和 UI，当状态变更，自动重新渲染整个组件。 最近前端界闹的沸沸扬扬的技术当属react了，加上项目需要等等原因，自己也决定花些时间来好好认识下这个东西。然后学习的时候顺便花时间写了一个demo：react-todos， 为了提起兴趣，你可以
阅读全文
摘要：前端工程师其实是一个工作很杂的职位，除了要负责切图、写html/css/js外，还要解决一系列的浏览器兼容性、网页性能优化等问题，所以提高前端工程师的开发效率是势在必行的，也是前端工程化的体现。 对于开发效率，我个人理解是 开发效率 = 新增代码的效率 + 修改代码的效率 + 维护代码的效率 那么如
阅读全文
摘要：对于复杂的单页面应用，状态（state）管理非常重要。state 可能包括：服务端的响应数据、本地对响应数据的缓存、本地创建的数据（比如，表单数据）以及一些 UI 的状态信息（比如，路由、选中的 tab、是否显示下拉列表、页码控制等等）。如果 state 变化不可预测，就会难于调试（state 不易
阅读全文
摘要：webpack 安装 命令行输入 配置文件 webpack.config.js 模块化 引入模块 style.css CSS模块引入 安装style-loader，css-loader 在项目配置中配置.css类型的加载器 启用devtool插件，并用source-map跟踪模块 在配置文件中插入d
阅读全文
摘要：一、什么是模块？ 定义：具有相同属性和行为的事物的集合在前端中：将一些属性比较类似和行为比较类似的内容放在同一个js文件里面，把这个js文件称为模块目的：为了每个js文件只关注与自身有关的事情，让每个js文件各行其职 二、什么是模块化？CommonJS是什么？AMD和CMD又是什么？ ①模块化：指的
阅读全文
摘要：项目结构说明 . ├── gulpfile.js # gulp任务配置 ├── mock/ # 假数据文件 ├── package.json # 项目配置 ├── README.md # 项目说明 ├── src # 源码目录 │ ├── pageA.html # 入口文件a │ ├── pageB
阅读全文
摘要：在前端开发的初始阶段，开发者通常只用关 html, css, javascript。但是现代化的前端开发已经不仅仅是业务代码本身，真正的前端开发环境涉及很多方面的需求，如： 开发需求 共享需求 性能需求 部署需求 这些东西我们都统一的叫做前端工程化，为了简化前端工程化的配置，出现了很多优秀的工具比如
阅读全文
摘要：前后端分离之后 前后端分离后, 大家从此进入了所谓的并行开发时代. 一旦完成前后端的(边界)分工, 大家就可以各司其职了. 前端在与后端交互时, 要想有效地提高工作效率, 后端的接口文档就是重中之重了. 接口文档还不够 所谓的接口文档, 即一份数据的契约书. 前端的所有逻辑和展现全部依赖接口文档中规
阅读全文
摘要：webpack是时下十分流行的编译和打包工具，它提供一种可扩展的loader的方式，简单的配置，便可以编译打包各类型的文件，包括js、css、image、font、html，以及各种预编译语言都不在话下。 一、回顾与思考 在上一节的【入门：十分钟自动化构建】中我们讲解了如何用gulp去搭建一个工作流
阅读全文
摘要：我们先来设定一个简单的需求： 一个本地开发环境，具备监控文件变化并实时更新的功能； 修改代码，保存之后浏览器自动刷新 实时编译各种预编译格式文件 压缩合并静态资源，打包输出 部署上传 一言不合就上图： 自动化构建（入门）.png 自动化构建（入门）.png 好，有了这个规划之后，我们开始着手来实现它
阅读全文
摘要：模块化是一种处理复杂系统分解成为更好的可管理模块的方式，它可以把系统代码划分为一系列职责单一，高度解耦且可替换的模块，系统中某一部分的变化将如何影响其它部分就会变得显而易见，系统的可维护性更加简单易得。 前端开发领域(JavaScript、CSS、Template)并没有为开发者们提供以一种简洁、有
阅读全文
摘要：一、什么是前后端分离？ 前后端分离的概念和优势在这里不再赘述，有兴趣的同学可以看各个前辈们一系列总结和讨论： 系列文章：前后端分离的思考与实践(1-6) slider: 淘宝前后端分离实践 知乎提问： 如何评价淘宝 UED 的 Midway Framework 前后端分离？ Web 前后端分离的意义
阅读全文
摘要：1. 什么是Git？ Git 是 Linux 发明者 Linus 开发的一款新时代的版本控制系统，那什么是版本控制系统呢？怎么理解？网上一大堆详细的介绍，但是大多枯燥乏味，对于新手也很难理解，这里我只举几个例子来帮助你们理解。 熟悉编程的知道，我们在软件开发中源代码其实是最重要的，那么对源代码的管理
阅读全文
摘要：建议在 React 中使用 CommonJS 模块系统，比如 browserify 或 webpack，本次使用 webpack。 第一步、安装全局包 第二步、创建根目录 创建一个根目录，目录名为：reactApp，再使用 npm init 初始化，生成 package.json 文件： 第三步、添
阅读全文
摘要：Gulp 是一款基于任务的设计模式的自动化工具，通过插件的配合解决全套前端解决方案，如静态页面压缩、图片压缩、JS合并、SASS同步编译并压缩CSS、服务器控制客户端同步刷新。 Gulp安装 全局安装Gulpjs npm install -g gulp #全局安装 npm install -g gu
阅读全文
摘要：Vue.js 是一款极简的 mvvm 框架，如果让我用一个词来形容它，就是 “轻·巧” 。如果用一句话来描述它，它能够集众多优秀逐流的前端框架之大成，但同时保持简单易用。废话不多说，来看几个例子： 首先，代码分两部分，一部分是 html，同时也是视图模板，里面包含一个值为 message的文本何一个
阅读全文
摘要：概述 Mock.js实现的功能 用法 浏览器： 返回值: JQuery： 配置模拟数据： 发送Ajax请求： 返回数据： Node.js： Angular.js: mock数据mockData.js: 语法 Mock.js 的语法规范包括两部分： 数据模板定义 DTD 数据模板中的每个属性由 3 部
阅读全文
摘要：一般来说，日常使用只要记住下图6个命令，就可以了 下面是我整理的常用 Git 命令清单。几个专用名词的译名如下。 Workspace：工作区 Index / Stage：暂存区 Repository：仓库区（或本地仓库） Remote：远程仓库 一、新建代码库 # 在当前目录新建一个Git代码库 $
阅读全文
浙公网安备 33010602011771号