转载自知乎，原文链接：https://zhuanlan.zhihu.com/p/141447713 通过插件我们可以扩展webpack，在合适的时机通过Webpack提供的 API 改变输出结果，使webpack可以执行更广泛的任务，拥有更强的构建能力。 本文将尝试探索 webpack 插件的工作流程，进而去揭秘它的工作原理。同时需要你对webpack底层和构建流程的一些东西有一定的了解。 想要了解 webpack 的插件的机制，需要弄明白以下几个知识点： 1. 一个简单的插件的构成 2. webpack构建流程 3. Tapable是如何把各个插件串联到一起的 4. compiler以及co ...

转载自网络 Alibaba F2E，原文链接：https://mp.weixin.qq.com/s/yXi1jYACrDAFqT7IKv3a5w 导读：微前端已经成为前端领域如今比较火爆的话题，关于微前端价值的讨论，可以参考克军的《拥抱云时代的前端开发框架——微前端》。微前端在技术方面，有一个始终绕不过去话题就是前端沙箱。本篇具体探讨一下，在微前端领域如何实现前端沙箱。 背景 应用沙箱可能是微前端技术体系里面最有意思的部分。一般来说沙箱是微前端技术体系中不是必须要做的事情，因为如果规范做的足够好，是能够避免掉一些变量冲突读写，CSS 样式冲突的情况。但是如果你在一个足够大的体系中，总不 ...

转载自网络 前端大全，原文链接：https://mp.weixin.qq.com/s/o7L_Sxl1s0uKywRy-Ao5fg 本文将针对微前端框架 qiankun 的源码进行深入解析，在源码讲解之前，我们先来了解一下什么是 微前端。 微前端 是一种类似于微服务的架构，它将微服务的理念应用于浏览器端，即将单页面前端应用由单一的单体应用转变为多个小型前端应用聚合为一的应用。各个前端应用还可以独立开发、独立部署。同时，它们也可以在共享组件的同时进行并行开发——这些组件可以通过 NPM 或者 Git Tag、Git Submodule 来管理。 qiankun（乾坤） 就是一款由蚂蚁金服推出的比 ...

转载自网络，原文链接：https://mp.weixin.qq.com/s/TU6rvx6vWQWROaxqO3qDsA \前言** 作为一个业务前端，完成业务需求的同时，还要处理各种线上问题，加班辛苦忙碌了一年，还要被老板说“思考是不够的”、“没有业务 sence”，出去面试，被问项目，也说不出什么有亮点或者有挑战的东西，想做点牛逼的东西，也没有发现什么有价值的方向，好不容易找到一些方向，还要被老板一顿质问，业务价值是什么？ROI 怎样？最终可能就只是做了一点性能优化工作，抽离了一些可复用的组件……不禁让人感叹，业务难、前端难、做业务的前端更难！ 如果你也有这样的感受和困境，我想告诉你，这 ...

转载自掘金，原文链接：https://juejin.im/post/5e575e02f265da573b0dad5f 贪心算法是一种很常见的算法思想，而且很好理解，因为它符合人们一般的思维习惯。下面我们由浅入深的来讲讲贪心算法。 找零问题我们先来看一个比较简单的问题： 假设你是一个商店老板，你需要给顾客找零n元钱，你手上有的钱的面值为：100元，50元，20元，5元，1元。请问如何找零使得所需要的钱币数量最少？ 例子：你需要找零126元，则所需钱币数量最少的方案为100元1找，20元1张，5元1张，1元1张。 这个问题在生活中很常见，买东西的时候经常会遇到，那我们一般是怎么思考的呢？假设我 ...

转载自网络，原文链接：https://overreacted.io/zh-hans/a-complete-guide-to-useeffect/ useEffect 完整指南你用Hooks写了一些组件，甚或写了一个小型应用。你可能很满意，使用它的API很舒服并且在这个过程中获得了一些小技巧。你甚至可能写了一些 custom Hooks去抽离重复的逻辑（精简掉了300行代码），并且得意地展示给你的同事看，“干得漂亮”，他们如是说。 但有时候当你使用useEffect你总觉得哪儿有点不对劲。你会嘀咕你可能遗漏了什么。它看起来像class的生命周期…但真的是这样吗？你发觉自己在问类似下面的这些问题： ...

转载自掘金网络，原文链接：https://juejin.im/post/5c99cbdee51d455b251df9eb 1 环境搭建、创建、运行1.1 介绍egg.js是阿里旗下基于node.js和koa是一个node企业级应用开发框架，可以帮助开发团队，和开发人员减少成本。基于koa2、es6、es7使得node具有更有规范的开发模式，更低的学习成本、更优雅的代码、更少的维护成本。 1.2 环境搭建1、要求nodejs版本必须大于8.0并且要用LTS 版本2、创建egg的环境 npm i egg-init -g / cnpm i egg-init -g (只需要安装一次)3 ...

当浏览器碰到 script 脚本的时候： 然后从实用角度来说呢，首先把所有脚本都丢到 body 之前是最佳实践，因为对于旧浏览器来说这是唯一的优化选择，此法可保证非脚本的其他一切元素能够以最快的速度得到加载和解析。 接着，我们来看一张图咯： 蓝色线代表网络读取，红色线代表执行时间，这俩都是针对脚本的；绿色线代表 HTML 解析。 此图告诉我们以下几个要点： defer 和 async 在网络读取（下载）这块儿是一样的，都是异步的（相较于 HTML 解析） 它俩的差别在于脚本下载完之后何时执行，显然 defer 是最接近我们对于应用脚本加载和执行的要求的 关于 defer，此图 ...

转载自 InfoQ，原文链接：https://www.infoq.cn/article/6tLtcBjW1YpzZ9Z4dXRZ 随着前端技术不断从 Web 延伸至各种“端”，大前端的概念早已成为业内共识。伴随着大前端的发展，与之相对应的前端工程体系也在不断拓展边界，仅仅只是构建、工具和规范等常规方式已经不足以表达当下前端工程所涉及的领域。 近日，InfoQ 记者有幸采访了阿里巴巴高级前端技术专家朱华军（阿大），他与我们分享了阿里集团前端工程化中台的实践过程，以及实践背后的经验与思考。他在采访中强调，前端工程化一定是大趋势，但不建议大家盲目地追求工程化，对于大部分规模不大的前端团队而言，工程体 ...

转载自掘金网络，原文链接：https://juejin.im/post/5b0374c66fb9a07acc12089d 前言近来公司需要构建一套 EMM（Enterprise Mobility Management）的管理平台，就这种面向企业的应用管理本身需要考虑的需求是十分复杂的，技术层面管理端和服务端构建是架构核心，客户端本身初期倒不需要那么复杂，作为移动端的负责人（其实也就是一个打杂的小组长），这个平台架构我自然是免不了去参与的，作为一个前端 jser 来公司这边总是接到这种不太像前端的工作，要是以前我可能会有些抵触这种业务层面需要考虑的很多，技术实现本身又不太容易积累技术成长的活。这 ...