切图崽的自我修养－－[BUILD]构建工具思路梳理
2016-11-12
阅读 2 分钟
2.2k之前也是从grunt/gulp/fis/过来的，到现在的webpack,中间有些问题没怎么细想，比如明明是构建工具为什么调试总是要开启一个http服务之类的，现在就来简单梳理下思路
切图崽的自我修养－[BUILD] webpack体验记录
2016-11-10
阅读 3 分钟
2.8k打包工具前端工程化一直是前端的一块重点.之前构建工具的选择上，公司也是很早之前就从grunt/gulp收拢为fis. fis的确是个好工具，作为工具核心的依赖表是非常好的构建思路，也是很多大公司一直在用的构建工具.
切图崽的自我修养－[MVVM] 如何监听数据变化
2016-10-26
阅读 2 分钟
2.9k通过事件的发布/监听的模式来实现数据监听. 即数据变化后，发布者会触发自定义的某个事件比如valueChage，然后订阅者捕获到这个事件后，实现后续处理(值判断/视图更新/其他自定义逻辑). 这其实就是最简单的事件处理的机制
切图崽的自我修养－[MVVM] 进一步认知viewModel
2016-10-15
阅读 2 分钟
2.8k上一篇讲到了MVC/MVP/MVVM, 但其实一直还对MVVM中的VM部分存在一些理解问题, 敲了一遍vue的demo之后，加深了对VM的理解
切图崽的自我修养－[MVVM] Js MV*模式浅谈
2016-10-06
阅读 6 分钟
2.5k做客户端开发、前端开发对MVC、MVP、MVVM这些名词不了解也应该大致听过，都是为了解决图形界面应用程序复杂性管理问题而产生的应用架构模式。网上很多文章关于这方面的讨论比较杂乱，各种MV模式之间的区别分不清，甚至有些描述都是错误的。本文追根溯源，从最经典的Smalltalk-80 MVC模式开始逐步还原图形界面之下最真实...
切图崽的自我修养－[TOOL] 用MockJs模拟数据
2016-10-05
阅读 1 分钟
4.1kMockJs 用前后端分离的开发模式，前端和后端约定好接口格式之后，前端可以用MockJs模拟返回数据，从而可以完全脱离后端进行开发 安装 {代码...} 使用 {代码...} 这里Mock.mock('@email')作用等价于Mock.Random.email() 拓展 {代码...} 自定义的拓展函数同理，用@占位符和调用具体的函数等价 API Basic 可模拟Boolean/Num...
切图崽的自我修养－[TOOL] 用Omnigraffle绘制UML
2016-10-04
阅读 2 分钟
15.3k喜欢装逼有品位的程序员都有一颗产品经理的心，但印象中产品经理经常要画一些奇奇怪怪七七八八的图，在请教了一些立志做产品经理的程序员之后，发现他们都有一套自己喜欢用的精致小巧的工具，其中经典的一套为Balsamiq mockups(线框原型)+Omnigraffle(通用图形)+Markdown(文本编辑)+Keynote(演示汇报)的Mac全家桶. 满满...
切图崽的自我修养－[TOOL] 常用命令行操作
2016-10-03
阅读 2 分钟
3.8k随着IT技术的日渐发展，各种可视化操作工具大行其道为广大程序员们提供了不少的便利.特别是作为一名对图形色彩都很敏感的前端工程师，自然也对图形化操作界面爱不释手. 但是在后端，运维等传统程序员噼里啪啦命令行敲得飞起的时候，总感觉自己被深深的鄙视了，由于自己是玻璃心，又不想生活在鄙视链的底层，于是就鼓捣了...
切图崽的自我修养－[HTTP] Http Proxy浅析
2016-10-02
阅读 2 分钟
4.1kWeb代理(proxy)服务器是网络的中间实体。 代理位于Web客户端和Web服务器之间，扮演“中间人”的角色。HTTP的代理服务器即是Web服务器又是Web客户端
切图崽的自我修养－[HTTP] 部署WEB服务流程梳理
2016-09-30
阅读 2 分钟
2.4k你想在云端部署两个web服务，一个新闻站点，一个游戏门户站点. 域名也已经想好了，是www.163.com和games.163.com, 用户通过访问www.163.com能访问到新闻站点， 通过访问games.163.com能访问游戏门户站点
切图崽的自我修养—[HTTP] 常见B/S架构简单梳理
2016-09-09
阅读 4 分钟
5.8k前言 客户端－服务器的通信会经历如下几个阶段: 客户端输入URL DNS服务器解析URL阶段 Web服务器解析Http请求阶段 应用服务器逻辑处理阶段 数据库操作阶段 Web服务器模版渲染阶段 Web服务器将Html返回给客户端 解析URL阶段 当客户在浏览器输入某个URL, 首先会经历域名解析阶段，即向DNS服务器解析目标URL返回对应目标URL...
切图崽的自我修养－[ES6] 生成器Generator浅析
2016-08-28
阅读 3 分钟
2.1kGenerator的核心实际上就是一个Iterator，通过yield关键字能够把函数体拆成完全可控执行片段，在函数体外部通过next来对这些执行片段进行遍历. 这和遍历array,set,map这些数据结构是一个道理.只不过generator用来遍历函数片段，而array/set/map 用来遍历元素.
切图崽的自我修养－[ES6] 迭代器Iterator浅析
2016-08-27
阅读 3 分钟
3.1kIterator不是array,也不是set,不是map, 它不是一个实体，而是一种访问机制，是一个用来访问某个对象的接口规范,为各种不同的数据结构提供统一的访问机制。任何数据结构只要部署Iterator接口，就可以完成遍历操作（即依次处理该数据结构的成员）。
切图崽的自我修养－[ES6] 编程风格规范
2016-08-27
阅读 2 分钟
1.8k前言 没有规矩 不成方圆 用let替换var来定义变量. 如果是常量，使用const 静态字符串统一用单引号'' , 动态拼接成的字符串统一用反引号`` {代码...} 使用数组成员对变量赋值时，尽量用解构赋值 {代码...} 往对象里添加/修改属性时，使用Object.assign，而不用松散的.语法 {代码...} 面向对象的写法一律写成class的形式，...
切图崽的自我修养－[ES6] 异步函数管理方案浅析
2016-08-26
阅读 5 分钟
1.9k前言 业务开发中经常会用到异步函数，这里简单的对异步函数以及它的各种各样的解决方案做一个浅析 优缺点: 优点: 能够极大的提高程序并发业务逻辑的能力. 缺点: 异步函数的书写方式和代码执行逻辑很不直观，回调函数这种方式不太符合人类的的线性思维 异步函数的执行流程通常不好管理 不好对异步函数部署错误处理机制 解...
切图崽的自我修养－模块插件化书写方式
2016-07-08
阅读 2 分钟
1.9k时刻谨记单一职责原则，一个基本方法只执行一个逻辑，如果有多个逻辑，请另外新增方法来对其他基本的颗粒化的方法进行组合，这样可以降低复杂度，时刻保证整个插件的易读性和可扩展性
切图崽的自我修养－梳理Jquery API
2016-07-08
阅读 3 分钟
2.1k前言 梳理一下Jquery中还不太熟悉的API Jquery事件绑定统一用on(摒弃掉之前的click,bind),解绑事件统一用off 语法糖，支持多个事件绑定同一个函数 {代码...} 语法糖，支持多个事件绑定不同的函数 {代码...} 语法糖，支持多个事件绑定不同的函数 {代码...} 可以往callback里传参 {代码...} 可以给未创建的DOM上绑定事件(...
切图崽的自我修养－优化图片加载流程
2016-07-07
阅读 3 分钟
6.5k我们经常用jquery, jquery中$(function){})实际上是DOMContentLoaded事件完成的回调，只是完成了DOM树的构建. 诸如Css的渲染以及页面内图片等资源的下载不一定完成了.所以如果此时呈现页面，页面会非常难看.
切图崽的自我修养－SeaJs重要概念剖析
2016-07-07
阅读 3 分钟
2.1k前言 高能预警，前方山路十八弯 在上一篇文章里简单的讨论了一下模块化Js, 先来回顾一下目前模块化的两大规范: CommonJs 同步加载模块规范 AMD/CMD 异步加载模块规范 其中CMD规范的产出是国内目前十分火爆的SeaJs, 这篇文章主要是解释几个使用SeaJs会碰到的重要概念 具名模块 匿名模块 路径即ID原则 匿名模块 SeaJs定义...
切图崽的自我修养－使用模块化JS
2016-07-06
阅读 3 分钟
3.4k模块化Js已经成为了老生常谈，不过在JavaScript设计之初，由于定位的问题并没有提供类的功能，开发者需要模拟出类似的功能，来隔离、组织复杂的JavaScript代码。之前的闭包也好，自执行函数也好，都是模块化的一些尝试，直到CommonJs规范推出之后，模块化Js才真正迅猛发展起来。
切图崽的自我修养－使用自动化工具
2016-07-06
阅读 1 分钟
2.3k想来大家对自动化构建工具已经不陌生了，自动化构建工具可以帮开发者省去很多重复劳动比如:语法纠错、文件打包、文件操作，合并压缩等等. 常用的自动化构建工具有Gulp,Grunt,Fis等等，这些构建工具核心都是依赖第三方插件，通过颗粒化任务，再将这些任务按照合适的方式进行组合，构建项目所需的自动化工作流
切图崽的自我修养－CSS踩坑纪录
2016-07-06
阅读 2 分钟
2.2k该元素是position:absolute, 元素定宽width的情况下，用left:50%; margin-left:-(1/2)width 能绝对居中
切图崽的自我修养－加载JS的常见方式
2016-07-04
阅读 1 分钟
2.4k看别人写的代码，<head>中写原生js无一例外加了window.onload, jquery示例中无一例外的加了 $(function(){}) But why? 从此这两尊神秘的大佛让我畏惧了很久，今天写的博文，就是为了崇尚科学破除迷信，撕下'规则' 的神秘面纱. 而这神秘的面纱，本质就是浏览器加载js的方式
切图崽的自我修养－提高项目加载速度
2016-07-04
阅读 2 分钟
3.5k前端作为一个最贴近用户的技术工种，毫无疑问应该把户体验放在第一位. 而用户体验，基本正比于页面的打开速度，特别是做移动端的同学，所以如何优化自己的项目，提高页面的加载速度成为重中之重.
切图崽的自我修养－规范CSS元素命名
2016-07-03
阅读 3 分钟
4.3k如何给变量，文件命名是程序员的老大难问题。命名为什么会这么难，因为它太重要了。可以这么说，准确的命名可以提高代码的可读性，让人容易理解，方便调试，也给以后修改和维护你的代码的人带来方便。
切图崽的自我修养－合理组织CSS结构
2016-07-02
阅读 3 分钟
2.5k从css方面来说，前端工程师和切图崽的区别，并不是指写单条css技巧的高低，甚至很多工程师在一些css的奇技淫巧都比不上切图崽. 那切图崽到底和工程师之间的差别是什么呢？ 差别是 N年工作经验 视野，是格局，是从大方向上得出解决问题的能力