前端 mvvm 框架底层学习(八、双向绑定加入发布订阅模式)

前言

上一篇《前端 mvvm 框架底层学习(七、双向绑定优化)》介绍了我们如何解决了双向绑定中的局部更新的问题,或者解决更小颗粒度更新的问题,但代码比较混乱,所有的 Dom 操作及数据绑定操作都耦合到了一起。这里我们来学习一下 Vue 是如何结合合经典的发布/订阅模式进行双向绑定优化的。 继续阅读“前端 mvvm 框架底层学习(八、双向绑定加入发布订阅模式)”

Vue 中使用渲染函数 render 实现无限节点的树

前言

我们在 Vue 的官方文档其中一节 渲染函数 & JSX 中有这么一句话:『Vue 推荐在绝大多数情况下使用模板来创建你的 HTML。然而在一些场景中,你真的需要 JavaScript 的完全编程的能力。这时你可以用渲染函数,它比模板更接近编译器。』,在实际项目中还真的遇到过一些使用模板解决不了的问题,如要生成一棵无限的 Dom 树,或者生成无限层级的菜单等情况。 继续阅读“Vue 中使用渲染函数 render 实现无限节点的树”

对每周十道前端大厂面试题中题目深度解答

前言

无意中浏览到了这样的一个 repo,叫《每周十道前端大厂面试题》(https://github.com/airuikun/Weekly-FE-Interview),看到里面其中的一些题目觉得挺有意思,就深度解答一下 继续阅读“对每周十道前端大厂面试题中题目深度解答”

Vue 是如何进行模板编译的?(三)

前言

上一节先把比较难以理解的一些正则先给简单介绍了,这一节原本是想来把可个Htmlparser的源码刨一下,但因为作者尤大大也是参考了 http://erik.eae.net/simplehtmlparser/simplehtmlparser.js 这个 simplehtmlparser 来改出来的,我们何不以 simplehtmlparser 来入手,自己 DIY,看能玩出什么花样,其实在写此文章前,我已经按自己的思路把 simplehtmlparser 简单改了一下, 继续阅读“Vue 是如何进行模板编译的?(三)”

Typescript+Gulp+Babel 常用前端流程自动化配置

前言

近期要开发一个 APP Webview 与 H5 交互的 js sdk,终于找到机会可以尝试使用 typescript 来开发 js sdk 库啦。按下面的配置文件使用 npm init 先初始化了项目,然后执行 npm install 或者 yarn install 按装相关的依赖包吧,这样就可以愉快的使用 typescript 来开发自己的 js 库了, 继续阅读“Typescript+Gulp+Babel 常用前端流程自动化配置”

Vue 是如何进行模板编译的?(二)

前言

上一节笼统介绍了 Vue 进行模板编译的过程,但其实其背后的复杂度绝对是超呼想象,要当其为一个庞大的工程来处理。众所周知,归根结底,Vue 项目也是一 html5 页面,要对其进行模板编译,也就时相当于去把这个页面所有的内容都给爬下来对其中的标签、属性等等进行一步步取值处理。下面,就一步步来欣赏其中的精彩: 继续阅读“Vue 是如何进行模板编译的?(二)”

Gastby V2 安装过程中常见问题

前言

之前在 cnblogs 上写过一篇《Gatsby 上手指南 – 让你的静态网站用 react 来高逼格的写》介绍 Gastby V1 版本的使用,但现在 V2 版本出来了,想尝尝新,发现这版本改动不是一般的大,单单是安装过程就已经要折腾许久,安装方式也有点不一样,以前 V1 版直接建议全局安装 Gastby 脚手架,然后通过脚手架来初始化创建项目,V2 版则建议使用 npm 的新命令 npx 来临时安装 Gastby 脚手架,然后初始化 Gastby 项目后,脚手架会自动被删除,官网也有解释原因是因为怕用了不同的版本会导致依赖包混乱导致一些依赖关系错误问题。下面就罗列一些安装过程中可能遇到的坑: 继续阅读“Gastby V2 安装过程中常见问题”

对大型综合管理类平台前端架构的思考

背景

谈到后台管理平台,很多人用过林林种种的各种各样的后台管理平台,前端还没兴起的时候,后台管理平台一直是后端一锅端的。各种开源的后台 CMS 类的管理平台,不管你是基于何种后端语言的,总可以找到不少开源的管理平台类的代码,但版面设计风格是比较死板和带着强烈的第二次工业革命的感觉。 继续阅读“对大型综合管理类平台前端架构的思考”

Vue 是如何进行模板编译的?(一)

前言

如果以简单使用者的角度来学习 vue,当然了解其相关的概念及使用方式足够,但如果是深度用户的话,或多或少会踩到不少框架及底层设计方式带来的不少的坑。比如,我们理所当然的认为,更新了状态,视图层会自动相应的更新,但现实是假如状态中使用到了数组,则我们经常会遇到更新了数组的值后,视图并没有按预期去自动更新, 继续阅读“Vue 是如何进行模板编译的?(一)”