一个大视频的背景，如果做的好，会是一个绝佳的体验！但是，在首页添加一个视频并不仅仅是随便找个人，然后加个 25mb 的视频，那会让你的所有的性能优化都付之一炬。

如果统计一番前端最常用的方法，那么 console.log 一定位列其中。无论你写的是原生 JS 亦或者是 JQuery、Vue等等，调试之时，都离不开 console.log 方法。但是，console 对象中的方法不仅仅只有 log 方法。强大的 console 对象提供了…

2019 农历新年即将到来，是时候总结一下团队过去一年的技术沉淀。过去一年我们支撑的数据相关业务突飞猛进，其中两个核心平台级产品代码量分别达到30+万行和80+万行，TS 模块数均超过1000个，协同开发人员增加到20+人。由于历史原因，开发框架同时基于 React 和 Ang…

以下为范例代码，本文中讲解多次用到这段代码，可以在阅读本文前提前运行，边看文边敲码验证。 每个对象都是基于一个引用类型创建的，这个引用类型可以是原生类型（Object、Array、Function等），也可以是用户自定义的类型。 通过new Function()生成函数并为其指…

React Hooks是React 16.8发布以来最吸引人的特性之一。在开始介绍React Hooks之前，让咱们先来理解一下什么是hooks。wikipedia是这样给hook下定义的： 通俗来说，Hook(钩子)就是通过拦截软件和系统内部函数调用和消息通信来增强原有功能的…

有时候我们需要在用户离开页面的时候，做一些上报来记录用户行为。又或者是发送服务器ajax请求，通知服务器用户已经离开，比如直播间内的退房操作。 本文主要分两部分来讲解怎么完成退出行为的上报。 浏览器有两个事件可以用来监听页面关闭，beforeunload和unload。 bef…

本文主要介绍字体加载优化的常用策略，大部分内容为引用和翻译。 这样就可以使我们的网页用上自定义字体了。 除了font-family 和 src属性之外，还拥有font-style以及font-weight属性。 src可以指定多种字体，会按顺序依次适用，比如上面的示例中会先加载…

面向对象编程是将事物看成一个个对象，对象有自己的属性有自己的方法。 比如人，我们先定义一个对象模板，我们可以定义一些属性 比如，名字年龄和功能，比如走路。我们把这个叫做类。 然后帮们将具体数据传入模板，成为一个个具体的人，我们将它叫做实例。 JS 中面向对象是使用原型（prot…

通过改变html元素的字体大小，就可以设置子元素的实际大小。 采用了 absolute，导致父元素脱离了文档流，那所有的子元素也需要脱离文档流。如果页面复杂，那开发的难度可想而知 其实也就是 BFC 的渲染规则（能说出以下四点就够了）。包括： BFC 内部的子元素，在垂直方向，…