Jerenyaoyelu / GoodArticles

收集一些平时浏览过的一些好文好贴

技术好文

收集/转载一些平时浏览到的写的还不错的好的技术文章/帖子

每次转载力求转载原帖，如若不是，欢迎指出

前端三剑客

CSS 篇

• 理解堆叠顺序和堆叠上下文

层叠顺序（自底而上）：

堆叠上下文根元素 >> 负z-index >> background >> border >> 块级元素 >> 浮动元素 >> 内联元素 >> z-index为0/auto的定位元素（不为static） >> 正z-index

• 外边距合并规则
  • 图文并茂解释合并
  • 合并规则及阻止方法

当两个普通文档流中的块级元素的垂直外边距相遇时，会发生边界重叠，两个合并成一个（两者中的较大者）。水平外边距和行内框、浮动框或绝对定位之间的垂直外边距不会合并。

• 什么是 BFC

前端框架

• 剖析 Vue 实现原理 - 如何实现双向绑定 mvvm
• 理解 Vue 生命周期

beforeCreate  ->inject -> Props ->  Methods ->  Data -> Computed -> Watch ->provide-> created

• 理解 Vue 数据双向绑定原理

  

• Vue 双向绑定原理（3.0 和 2.0 优缺点对比）

2.0用的是defineProperty来劫持数据的每个属性实现监听相应，3.0使用了proxy代理了整个数据对象实现监听

• 深入剖析：Vue 核心之虚拟 DOM
  

微信小程序

• 同层渲染原理

• 渲染性能调优

nodejs

• 区分exports/exports default/module export

- module.exports/exports: CommonJS规范 （exports是前者的一个引用）
- export/import: es6规范
- require: CommonJS和es6都支持

>> CommonJS定义的模块分为: 模块标识(module)、模块定义(exports) 、模块引用(require)

• node.js 模块的接口设计模式

• https://segmentfault.com/a/1190000016278115

前端工程化

• 前端工程化实践总结
• 微信小程序工程化探索
• 小程序工程化探索
• webpack5 小程序工程化 example

前端构建

• 前端为什么需要构建工具

SASS/LESS等预处理、代码风格检查与测试、资源压缩、静态资源替换

• Gulp 应用场景

解决静态文件版本问题、JS和CSS的依赖问题、性能优化、效率提升

性能优化

Web

• SPA 的 SEO 方案对比、最终实践

打包

• Tree-Shaking 性能优化实践 - 原理篇

tree-shaking消除无用的代码，以减少需要加载的js文件体积，使得整体执行时间缩短而达到性能优化的效果。

电子书

• TypeScript 入门教程

阮一峰：

《TypeScript 入门教程》全面介绍了 TypeScript 强大的类型系统，完整而简洁，示例丰富，比官方文档更易读，非常适合作为初学者学习 TypeScript 的第一本书。

• 现代浏览器工作原理

其他杂文

• 通俗易懂的解释什么是 RPC
• 实现 gitlab PR 自动流程处理机器人
• 只是痒点需求的产品，怎么做起来？！

声明

以上内容皆为转载，如有涉及侵权，请联系删除