有没有遇到这样一种情况，你花了很大精力在业务项目中写了一个组件，你觉得这个组件很通用，除了当前的业务场景还应该有其他的应用场景，所以你想开源这个组件，但又不知道从何入手。这篇文章就来聊聊如何开源一个前端组件，无论是业务中已有的组件还是新的组件。

2015 年 HTTP/2 标准发表后，大多数主流浏览器也于当年年底支持该标准。此后，凭借着多路复用、头部压缩、服务器推送等优势，HTTP/2 得到了越来越多知名互联网公司的青睐。就在大家刚刚为了解了 HTTP/2 新特性而舒口气儿的时候，HTTP/3 却又紧锣密鼓地准备着了。今天就跟大家聊一聊这第三代 HTTP 技术。

纯函数的意思是传入同样的输入应该得到同样的输出，对应的，对于一个函数组件而言，如果传入同样的 props，渲染结果也应该一样的话，那么使用 React.memo 包裹这个函数组件则可以获得较大的性能提升。

Github Actions 是 GitHub Universe 大会上发布的，被 Github 主管 Sam Lambert 称为“再次改变软件开发”的一款重磅功能（“we believe we will once again revolutionize software development.”）。本文目的是向大家介绍这一 Github 全新的功能，更多内容可以查看文末的拓展阅读。

下一代功能强大的 React 和 React Native APP 的数据库，WatermelonDB 特地为复杂的 React 和 React Native APP 做了优化，首要目标就是性能，换句话说就是要快速启动。

这个游戏的名字叫：Chrome Dino，你现在可以打开 Chrome，不需要断开网络，只需要在地址栏输入 chrome://dino 即可畅玩。

JSConf Iceland 大会于 3.1 - 3.2 在冰岛举行，在会中，React 核心团队的 Dan Abramov 发表了名为 “Beyond React 16” 的演讲，描述了对 React 未来的展望，本文根据 Dan 的演讲整理。

本文的目标是以“输入 URL 后发生了什么”这个经典面试题为引子，写一篇既能够涵盖面试中大部分网络试题，又能够将“输入 URL 后发生什么”讲得有深度的文章。以前写过一篇类似的文章，但实在过于简单。另外，HTTPS 逐渐普及，文章中没有这部分过程也说不过去。不想修改原来的文章，就重新写一篇吧。文中以我所在的项目“兴趣...

刚加入团队时，团队中没有统一的代码规范，虽然大多数人都有良好的代码风格，但毕竟习惯还是有差异的，导致代码中存在很多风格不一致的情况，所以我们便开启了统一团队代码风格的尝试。下面将这个过程做一个整理与总结。

本文对兴趣部落项目前端开发中使用到的性能优化方式进行总结。兴趣部落项目是手机QQ（以下简称手Q）中最大的纯网页应用，每日有大量的用户访问，对于腾讯这样一个对产品有着极致要求的公司，性能优化是一个绕不开的话题。下面就对项目中所使用的性能优化的方式做一个梳理。

​因为历史原因，刚进小组时，组内主要利用 SVN 作为兴趣部落的代码托管工具，最近组里重新定义了一套代码 Review 规范，而 SVN 不能满足我们的需求，再加上公司的 Git 平台已经成熟可用，我们便萌生了将兴趣部落的代码从 SVN 迁移到 Git 上的念头。经过几天的努力，现在代码已迁移完成，下面就把过程与总结写下来供大家...

首先我们先直观地感受下什么是 DOMContentLoaded。打开 Chrome DevTools，切到 Network 面板，重新加载网页，得到如下截图：

前段时间被一个重大的新闻刷屏了，那就是 Google 攻破了 SHA-1。很多人看了后的第一反应大概就是：哦，知道了~ 很多事情看起来跟我们无关，实际上却对我们产生了巨大的影响，比如川普当选总统，我们很多人总觉得这事离我们很遥远，但其实就像一滴水滴落水中，很快便会波及四周。Google 攻破 SHA-1 这事也是，看似跟我们...

这篇文章主要聊一聊 HTML5 中的 <b> 和 <strong>，以及 <i> 和 <em>。

在文章开头，需要普及一下几个概念，那就是 Chrome 中的 extension、app 和 plugin，分别是扩展、应用和插件的意思，不能混为一谈。

写在前面：文章是 Chrome DevTools 介绍系列的一部分，查看全部文章可以关注 Github 上的 Chrome DevTools 详解，也可以关注这个系列所在的项目：front-end-study。

写在前面：Chrome DevTools 系列文章正在紧张地整理当中，目前正在整理 DevTools 的第一部分： Elements，大家可以关注 Chrome DevTools 来获得最新的信息，也可以关注整个项目front-end-study。

Markdown 是一种轻量级的标记语言，其用简单的标记语法便可达到排版的目的，其可以使我们更加专注于内容的编写，而不需过多关注排版。本文主要整理了 Markdown 中的常用的标记语法，以便自己与他人以后查用。

Atom 是 Github 官方开发的一款可定制化的、跨平台的文本编辑器。有两点需要注意一下，一是 Atom 是由 Github 官方开发，二是其定制化程度非常高。前者的结果是编辑器对 Github 非常友好，如果项目托管在 Github 上的话，用 Atom 可以很方便地进行 Git 操作。后者的结果就是我们可以根据自己的需要定制自己的编辑器，使...

根据 Wiki 的定义，垃圾回收是一种自动的内存管理机制。当计算机上的动态内存不再需要时，就应该予以释放，以让出内存。直白点讲，就是程序是运行在内存里的，当声明一个变量、定义一个函数时都会占用内存。内存的容量是有限的，如果变量、函数等只有产生没有消亡的过程，那迟早内存有被完全占用的时候。这个时候，不仅...

1. 什么是 arguments MDN 上解释： arguments 是一个类数组对象。代表传给一个function的参数列表。 我们先用一个例子直观了解下 JavaScript 中的 arguments 长什么样子。 {代码...} 执行结果是： {代码...} 乍一看，结果是个数组，但并不是真正的数组，所以说 arguments 是一个类数组的对象（想了解真正数组与类数组对...

同样的，对脑图感兴趣可以私戳~

搞 Web 开发离不开安全这个话题，确保网站或者网页应用的安全性，是每个开发人员都应该了解的事。本篇主要简单介绍在 Web 领域几种常见的攻击手段。

人月神话 （如需高清无码大图可以私信） 没有银弹 软件活动包括： 1、根本任务：打造由抽象软件实体构成的复杂概念结构 2、次要任务：使用编程语言表达这些抽象实体，在空间和时间限制内将它们映射成机器语言 软件开发困难： 1、根本的：软件特性中固有的困难 2、次要的：出现在目前生产上的，但并非那些与生俱来的困难 ...

最近小组在做一个智慧交通的项目，其中有个 “分享屏幕” 的功能，即一个 client 能够将自己当前的页面分享到另外一个 client，针对这个需求，我们利用了 WebSocket 技术，具体说是 Socket.IO。

事件是指在文档或者浏览器中发生的一些特定交互瞬间，比如打开某一个网页，浏览器加载完成后会触发 load 事件，当鼠标悬浮于某一个元素上时会触发 hover 事件，当鼠标点击某一个元素时会触发 click 事件等等。

this 是 JavaScript 中的一个关键字，当一个函数被调用时，除了传入函数的显式参数以外，名为 this 的隐式参数也被传入了函数。this 参数指向了一个自动生成的内部对象，这个内部对象被称为函数上下文。与其他面向对象的语言不同的是， JavaScript 中的 this 依赖于函数的调用方式。所以，想要明白 this 的指向问题，还...

Markdown 是一种轻量级的标记语言，其用简单的标记语法便可达到排版的目的，其可以使我们更加专注于内容的编写，而不需过多关注排版。本文主要整理了 Markdown 中的常用的标记语法，以便自己与他人以后查用。