前端首页渲染速度优化，这张图是我发现的比较宝藏，比较全面的一张首页加载优化图，便以此图来进行相关总结

This is a collection of free ebooks for the front-end developers about JavaScript, ES6, NodeJS, CSS3 and HTML5.

前言 虽然马上就要金九银十了，面试的人应该不少，虽然我也有在面，写文的目的主要是梳理下知识，能对复习有点帮助就行，本文主要针对前端知识体系相关。

一般人没事的时候刷刷朋友圈、微博、电视剧、知乎，而有些人是没事的时候刷刷 GitHub ，看看最近有哪些流行的项目。 久而久之，这差距就越来越大，因此总会有开源信息的不对称，有哪些优秀的前端开源项目值得学习的也不知道。 初步前端与高级前端之间，最大的差距可能就是信息差造成的。 …

大家好，我是 Steven。 今集我们会尝试只用 HTML 和 CSS，实现基础的轮播图效果，当然会有一些功能的缺失，例如不能自动跳转，但我们来看看用 CSS 可以实现到多少。 打开 CodePen 编辑器，先建立 HTML 的结构，轮播图我会用 <ul> 去制作，加…

建议结合源码一起阅读，效果更好（这个 DEMO 使用的是 Vue 技术栈）。 1. 编辑器 先来看一下页面的整体结构。 这一节要讲的编辑器其实就是中间的画布。它的作用是：当从左边组件列表拖拽出一个组件放到画布中时，画布要把这个组件渲染出来。 用一个数组 componentDat…

类似Tinder和探探的卡片效果的组件，社区中已经非常多了。我这一版除了可以实现和他们一样的效果外。还增加了飞卡的效果，就是类似我的女神邱淑贞这样。 其实我最早实现这个效果，是在2018年的时候，在weex上实现过一版。原帖请看这里：https://zhuanlan.zhihu…

猫哥是一个常年混迹在 GitHub 上的猫星人，所以发现了不少好的前端开源项目，在此分享给大家。 以下为【前端GitHub】的第 9 期精华内容。 1. LightHouse LightHouse 是一个开源的自动化工具，用于改进网络应用的质量。 可以将其作为一个 Chrome…