余阿良的博客

原创 Serverless带来的思考

原创 URL输入到页面加载期间的性能优化总结

URL输入到页面加载期间的性能优化总结。从URL输入到页面显示，这期间具体发生了什么？并从中总结出可以优化页面加载速度的点。DNS解析>

转载 Webpack HMR 原理解析

Webpack HMR 原理解析

原创 js异步编程：回调、发布订阅、Promise、async、generator

Generator函数的含义与用法http://www.ruanyifeng.com/blog/2015/04/generator.htmlThunk函数的含义与用法http://www.ruanyifeng.com/blog/2015/05/thunk.htmlco函数库的含义与用法http://www.ruanyifeng.com/blog/2015/05/co.htmlasync...

转载 flutter、rn、uni-app比较

转自：DCloud社区 uni-app频道的文章Flutter、RN、uni-app比较前言每当我们评估新技术时要问的第一个问题就是“它会给我们的业务和客户带来哪些价值？”，工程师们很容易对闪闪发光的新事物着迷，却经常会忽略这些新事物其实可能对我们的客户没有任何好处，反而只会让现有的工作流程更加复杂。flutter最近比较热闹，毕竟是Google出品。但我们不是炒作热点的媒体，也不...

原创 前端工程师的第一个Flutter应用

Flutterwhat is Flutter?Flutter是谷歌的移动UI框架，用于在创纪录的时间内在iOS和Android上制作高质量的原生界面。 Flutter与现有代码一起使用，由世界各地的开发人员和组织使用，并且是免费和开源的。why is Flutter?同时支持JIT 和 AOT高性能自绘引擎开发友好，得益于JITdart：强类型语言收获屏幕截图你将熟...

原创 Vue2.x 源码阅读思路笔记

背景在解决Vue项目中问题的过程中，仅仅片段了解过部分源码。随着使用的深入，希望整体了解这个框架的设计思想和细节。在Github中发现了这份笔记，完整的记录了实现Vue框架的完整过程，通过参考这些笔记，我节省了大量的阅读时间。推荐给大家。参考：https://github.com/raphealguo/how-to-learn-vue2-blob以下内容为自己的笔记，仅供自己整理思路用...

原创 实现点击空白区域隐藏下拉弹窗

分析elemntui v-clickoutside，实现点击开白区域隐藏下拉弹窗问题

转载 小程序框架全面测评

转自 凹凸实验室（https://aotu.io/notes/2019/03/12/mini-program-framework-full-review/）最近前端届多端框架频出，相信很多有代码多端运行需求的开发者都会产生一些疑惑：这些框架都有什么优缺点？到底应该用哪个？作为 Taro 开发团队一员，笔者想在本文尽量站在一个客观公正的角度去评价各个框架的选型和优劣。但宥于利益相关，本文的观...

转载 JavaScript捕获、冒泡事件执行顺序详解

转自 https://bobscript.com/archives/412/

原创 AST介绍：解析html生成语法树

前言这个名词一直不陌生，但是没有细致了解过，结合自己的项目，记录一下自己对AST的理解。什么是AST(抽象语法树)？抽象语法树（abstract syntax tree或者缩写为AST），或者语法树（syntax tree），是源代码的抽象语法结构的树状表现形式，这里特指编程语言的源代码。AST的作用？解释器/编译器进行语法分析的基础AST的使用场景？JS：代码压缩、混淆、编译...

原创 WebStorm、IDE、VSCode集成Eslint

58到家、快狗打车（58速运）、58家政收简历啦~最近想换工作的同学~ 欢迎拿简历砸我~ 加我微信：15501423004 （记得备注 内推 哈~）目的自动检测语法错误，提升代码质量的同时也是的代码风格统一，较少交接成本。结合IDE自动解决低级语法错误，提高开发效率。前言ESLint是什么？ESLint最初是由Nicholas C. Zakas 于2013年6月创建的开源项...

原创 代码规范整理

代码规范希望自己的代码是清晰、可读的。因此给自己指定一定的规范，根据自己实践结果不断改进。 内容中有摘自网络的部分，在文章附录中附有链接，如果侵权联系删除。命名规则项目、js、css、HTML文件命名全部采用小写方式， 以下划线分隔。 例：my_project_name、data_models、account_model.js、retina_sprites.scss...

原创 简版Git工作流

Git工作流目的规范开发流程加入代码审查分支介绍master：记录tag用。develop：主开发分支、预上线分支feature-xxx：功能分支test：测试环境分支、pr分支hotfix：紧急BUG修改分支 test分支：测试环境部署 develop分支：沙箱、线上环境部署开发流程介绍develop => fea...

原创 为什么使用 Git-flow 工作流

联想乐窗项目组-前端组 张晋佩整理 内容摘自网上，如有侵权，联系删除Git-flow 工作流介绍主要内容本文主要分主要包括以下几个部分的内容集中式工作流功能分支工作流功能分支工作流的问题git flow 的分支模型介绍git flow 的工作方式git flow 的操作命令smartgit 中使用 git flow命令行使用 git flow集中式工...

原创 CSS（GPU）动画优化

浏览器解析和CSS（GPU）动画优化联想乐窗项目组-前端团队 内容摘抄于网上博客，侵权联系修改。reflow和repaint都是耗费浏览器性能的操作，这两者尤以reflow为甚；因为每次reflow，浏览器都要重新计算每个元素的形状和位置。下面是一些针对reflow和repaint的最佳实践： 1. 不要一条一条地修改dom的样式，尽量使用className一次修改。 2....

原创 生成vue-router 文件

联想乐窗项目组-前端团队/* * 递归同步抓取src/page 下所有一Routes.js命名的文件，最终生成src/page/allRoutes.js文件 * */var fs = require('fs');var path = require('path');var pagePath = path.join(__dirname, './src/view');var impo...

原创 视差滚动

利用background-attachment属性实现视差滚动：background-attachment:scroll: 默认值。背景图像会随着页面其余部分的滚动而移动。fixed: 当页面的其余部分滚动时，背景图像不会移动。inherit: 规定应该从父元素继承 background-attachment 属性的设置。html>head> title>backgr