分类: architecture

前端工程体系

我常常执着于部分(比如昏天暗地地解读一个源码),不能跳出来看看整体。这篇文章旨在于整理我所理解的前端工程体系,方便逐步演进顶层观念并指导后续发展。因为见识的有限和理解的不足,这篇文章本难免缺陷和差缪,还望有识予以理解。 我所理解的前端工程体系大致如上图。左半部分以 antd + umi、fusion + 飞冰为参照加以说明,组件库用于提供基础的通用组件。模板工程通常提供了应用层面的最佳实践,因此

前端技术汇总贴

下载立即收藏!这应该是你见过的最全前端下载总结 校验身份证号根据〖中华人民共和国国家标准 GB 11643-1999〗中有关公民身份号码的规定,公民身份号码是特征组合码,由十七位数字本体码和一位数字校验码组成。排列顺序从左至右依次为:六位数字地址码,八位数字出生日期码,三位数字顺序码和一位数字校验码。 地址码表示编码对象常住户口所在县(市、旗、区)的行政区划代码。 出生日期码表示编码对象出生的年

js 事件循环

事件循环基本js 是一门单线程非阻塞脚本语言。即便浏览器推出的 web worker 也只允许子线程承担计算任务,而不能操纵 dom 节点(因为主、子线程同时操纵 dom 会造成不一致)。 执行栈可用于解释 js 引擎对同步脚本的处理。即当函数首次被调用时,js 引擎就会为该过程创建执行上下文,并将该执行上下文压入执行栈中。执行上下文也称为执行环境,包含函数的私有作用域、父级作用域、参数、作用域中

qiankun 微服务

qiankun 基于 single-spa、import-html-entry 实现。 启动流程跟 single-spa 一样,qiankun 启动微服务的流程仅有两步: registerMicroApps(apps, lifeCycles?, opts?) 注册应用。 start(opts?) 启动。 qiankun 提供了以下新特性: qiankun 微服务的渲染内容通过 html 脚本

single-spa 实现前端微服务

文档及示例single-spa 具有以下功能特性:在无须刷新页面的前提下,同一个页面可使用不同的框架;基于不同框架实现的前端应用可以独立部署;制作新内容时可以使用不同的框架;支持应用内脚本的懒加载。 single-spa 借鉴了组件生命周期的思想,它为应用设置了针对路由的生命周期。当应用匹配路由/处于激活状态时,应用会把自身的内容挂载到页面上;反之则卸载。典型的 single-spa 由 html

前端规范

git123456cnpm install -g commitizen # cli 工具cnpm install -g conventional-changelog # 基于 commit message 生成 change logcnpm install validate-commit-msg --save-dev # 检查项目的 commit message 是否符合 Angular 规范。基

自动化部署

参考Jenkins本地搭建遇到的问题 for Mac使用git做服务器端代码的部署Git Hooks、GitLab CI持续集成以及使用Jenkins实现自动化任务持续集成 の 使用 git hook 部署代码前端自动化发布实战总结

前端监控

前端监控前端监控包含 js 错误统计、js 错误诊断、api 统计监控、前后端链路追踪、文件加载失败监控、页面访问速度、慢回话追踪等。 js 错误统计可以借助 try…catch、window.onerror 实现。try…catch 能捕获到错误信息描述、堆栈、行号、列号、具体的出错文件信息等,但是它只能在单一的作用域内捕获错误,不能捕获异步函数的错误,如 setTimeout 函数就需要在其内

前端调试

基本调试可以借助 chrome 控制台实现。 同步刷新browser-syncbrowser-sync 通过 web-socket 将变更内容透出到页面侧,因此无须刷新页面。browser-sync 提供了两个方法:init({ server }) 启动本地静态服务器,init({ proxy }) 启动代理服务器(当本地服务器通过其他方式启动时,browser-sync 选用代理模式启动);re

前端埋点

埋点统计数据用户访问统计用户访问统计包含 PV(Page View)、UV(Unique Visitor)、VV(Visit View)、IP 等。PV 用来统计一天之内页面的被访问次数,机刷也可以造成 PV 数据提升。UV 用来统计一天之内访问页面的用户数量,一般使用 IP 统计(IP 统计并不谨慎,同一个办公区或校园公用一个 IP);使用 cookie + IP 统计(cookie 会被刷新,