本文对微前端的概念和场景进行科普，介绍一些主流的微前端的实现库及其用法，并讲解部分这些库的原理和实践知识。
说起微前端框架，很多人第一反应就是 single-spa[1]。但是再问深入一点：它是干嘛的，它有什么用，可能就回答不出来了。
2018年，single-spa诞生了，single-spa是一个小于5kb（gzip）npm包，用于协调微前端的挂载和卸载。只做两件事： 提供生命周期，并负责调度子应用的生命周期。挟持 url 变化，url 变化时匹配对应子应用，并执行生命周期流程。
之前比较多的处理方式是npm包形式抽离和引用，比如多个应用项目之间，可能有某业务逻辑模块或者其他是可复用的，便抽离出来以npm包的形式进行管理和使用。但这样却带来了以下几个问题：
这里建议先复习一下《再唠叨JS模块化加载之CommonJS、AMD、CMD、ES6》
Angular2 已经发布 beta9 ， 是时候折腾一下了。 Angular2 和 AngularJS 1.x 相比， 可以说是全新的框架， 除了名字有延续性之外， 能延续的真的不多。
我们用 NgModules 把 Angular 应用组织成了一些功能相关的代码块。
大家好，我是海怪。了解过微前端的同学应该对 single-spa 这个框架都不陌生，但是我翻看了中文整个社区，发现太少文章是讲 single-spa Demo 实践的。
本文所有内容以 Angular 2 Quick Start 项目为基础，使用 TypeScript 语言。
JavaScript 语言最初是为简单的表单操作而发明的，没有诸如模块或命名空间之类的内置功能。多年以来发明了大量的术语、模式、库、语法和工具来模块化 JavaScript。本文讨论了 JavaScript 中的所有主流模块系统、格式、库和工具，包括：
组件/模块异步加载方案，请参看《前端模块化方案：前端模块化/插件化异步加载方案探索》
我所在团队是做 toB 业务的，技术栈是 Vue，团队目前有十多个典型的 toB 业务（菜单+内容布局），这些业务都是服务于一个大平台的，因为历史原因，每个业务都是独立的，都有一个 html 入口，所以当用户在这个大平台上使用这十多个业务的时候，每当切换系统时，页面都会刷新，体验很差；在开发层面，这十多个业务又有太多共同之处，每次修改成本都很高。
我所在团队是做toB业务的，技术栈是Vue，团队目前有十多个典型的toB业务（菜单+内容布局），这些业务都是服务于一个大平台的，因为历史原因，每个业务都是独立的，都有一个html入口，所以当用户在这个大平台上使用这十多个业务的时候，每当切换系统时，页面都会刷新，体验很差；在开发层面，这十多个业务又有太多共同之处，每次修改成本都很高。
现代 Javascript 项目需要用打包工具来将小段代码编译成库或者应用程序那种更大更复杂的东西。流行的打包器有webpack、Rollup、Parcel、RequireJS 和 Browserify。它们将 JavaScript 代码转换为可以作为一个 bundle 加载的模块。
原文链接：https://itnext.io/11-micro-frontends-frameworks-you-should-know-b66913b9cd20
微前端作为近两年兴起的一种解决方案，也不是什么新东西了，既然是解决方案，那么微前端帮我们解决了什么问题呢？这里我以我们项目组为例子讲讲：
准备学习angularjs2,安装的过程费了不少时间，刚开始为了方便，从官网上下载了现成的包，但是就运行不起来，后来还是老老实实按教程一步步建文件，ng2详细地址https://angular.cn/docs/ts/latest/quickstart.html 从官网中提取几个主要步骤 首先安装nodejs ,node js里面有自带的npm,也就是安装了node js后也同时安装npm
AngularJS当初是提供给设计人员用来快速构建HTML表单的一个内部工具。随着时间的推移，各种特性 被加入进去以适应不同场景下的应用开发。然而由于最初的架构限制（比如绑定和模板机制），性能的 提升已经非常困难了。
之前写过一篇文章，《将 React 应用迁移至 Vite》介绍了 Vite 的优势，并且和 webpack 做对比，但 webpack5 有个很重要的功能，就是模块联邦，那么什么是模块联邦？Vite 中也可以实现吗？ 我们一起来探究下。
Single-spa 是一个将多个单页面应用聚合为一个整体应用的 JavaScript 微前端框架。使用 single-spa 进行前端架构设计可以带来很多好处，例如:
现代 Web 应用 正在变得越来越庞大和复杂，有时候这样的应用会由不同的团队来管理。应用可能会包含不同团队开发的特性，在交付整个应用之前，我们可能希望只将某些特定的功能发布到生产环境中。如果整个应用只有一个仓库（repo），那我们该如何管理不同的团队和不同的发布周期呢？
本章节使用的是 TypeScript 来创建 Angular 的应用，这也是官方推荐使用的，本教程的实例也将采用 TypeScript 来编写。
微前端将前端整体分解为许多更小、更易管理的片段。每个团队可以端到端地拥有自己的功能，可以在自己的代码库中工作，可以独立发布版本，可以不断进行小的增量升级，还可以通过 API 与其他团队集成，以便他们可以一起组建和管理页面和应用程序。本文中，作者收集了 11 个最杰出的微前端构建工具，并提供了进一步学习的链接和视频。将单体后端分解成为微服务之后，后端开发流程已在效率和规模上取得了显著进步。然而，当今大多数前端应用程序架构仍然是单体式的，使得前端开发流程很难加速和扩展。
毕业前对前端工程化一直没有什么切身的体会，现在工作也有半年多了，体会也越来越深，npm，yarn，Webpack ，gulp，Babel，ESlint，TypeScript 最近准备一一去深入了解一下，看到一篇不错的关于前端工程化的发展过程，就翻译了一下，How it feels to learn JavaScript in 2016，
微前端，相信大家就算没用过，也一定听过。什么是微前端，为什么要上微前端，它和iframe的区别是什么，大家在网上可以找到很多相关的文章，这里就不在赘述了。我想通过这个《微前端落地系列》，把我对某个公有云系统做整体微前端架构改进的过程分享出来，向大家展示一条真正走过的路，踩过的坑。希望在此过程中，能和大家一起讨论，一起学习，一起进步。
最近 angular-ui 团队终于正式发布了基于 Angular 2 的 Bootstrap 界面库 ng-bootstrap ， 工作中一直用 AngularJS 1.x 的 UI Bootstrap ， 因此对这个 ng-bootstrap 也是很感兴趣， 第一时间进行试用。
嘿，我最近接到一个 Web 项目，不过老实说，我这两年没怎么接触 Web 编程，听说 Web 技术已经发生了一些变化。听说你是这里对新技术最了解的 Web 开发工程师？
树形结构是一种非常常见的数据结构，它由一组以层次关系排列的节点组成。树的结构类似于自然界中的一棵树，树根对应顶层节点，而子节点则分支延伸出来。
我们一般用script标签加载js，本来脚本是同步加载，用defer和async属性可以一步加载，两者的区别是，defer是渲染完执行，也就是DOM结构完全生成，async是下载完执行，所以defer会按顺序加载，async不能保证顺序。
https://itnext.io/11-micro-frontends-frameworks-you-should-know-b66913b9cd20
微前端将前端整体分解为许多更小、更易管理的片段。每个团队可以端到端地拥有自己的功能，可以在自己的代码库中工作，可以独立发布版本，可以不断进行小的增量升级，还可以通过 API 与其他团队集成，以便他们可以一起组建和管理页面和应用程序。本文中，作者收集了 11 个最杰出的微前端构建工具，并提供了进一步学习的链接和视频。
英文：Laurie Voss 译文：葡萄城控件 www.cnblogs.com/powertoolsteam/p/the-state-of-javascript-frameworks-2017-part-3-back-end-frameworks.html 本文是2017年 JavaScript 框架回顾系列的最后的一篇文章，主要介绍 JavaScript 的后端框架情况。 第一篇：《2017 前端框架的现状》 第二篇：《2017 年 JS 框架回顾：React 生态系统》 从上图中可以看到，Expr
本文是2017年 JavaScript 框架回顾系列的最后的一篇文章，主要介绍 JavaScript 的后端框架情况。 从上图中可以看到，Express 作为用 JavaScript 编写的后端服务的
在微前端出现之前，一个系统的前端开发模式基本都是单仓库，包含了所有的功能、代码...
Hello各位，本葡萄又来啦，今天遇到的场景是这样的：在日常业务流程中，经常需要某一流程环节中相关责任人员进行审批签字，早期许多公司为了省事就直接会把这位负责人的签名以键盘打字（楷体）的形式打印出来，但是这样的坏处就是会导致所有的负责人的签名都是一样的，没有美感，为了解决这个问题，一些公司就开始使用手写签名（用鼠标写出来的签名）代替电子签名，今天本葡萄就为大家简单的介绍下手写签名到底是怎么实现的。话不多说，先上效果图：
Angular 2 已经发布了 2.1.2 版本， 相信很多人已经在使用（试用）了， 相比 AngularJS 1.x ， Angular 2 在性能上有了长足的进步， 同时 Angular 2 也变得非常的庞大， 动辄几兆的脚本， 如何部署到生产环境？ 接下来就介绍如何为生产环境编译 Angular 2 应用， 在本文中， 我们将 Angular 2 官方文档中的 Hello Angular 应用编译到 50K 以下， 以用于生产环境。
今天主要和大家分享四个内容：第一，是为什么我们要选择 Angular；第二，是我们在使用 Angular 过程中总结的一些比较好的实践；第三，是怎样更好的组织项目结构；第四，是谈一下我对整合 Angular 的 ES6 和 JSPM 的见解。 选择 Angular 的原因 为什么选择 Angular 呢？由于团队原因，当时我们只有三名程序员，两个后端一个前端。 效果有两个：第一个是做到前后端分离，因为传统的模式效率太低了；第二个是应用逻辑与 DOM 解耦，做前端开发的同学也都应该知道 DOM 的操作实际上
导语 | 微前端是将Web应用由单一的单体应用转变为多个小型前端应用聚合为一的一种手段。本文从微前端的基础理论出发，对其核心技术进行阐述，最后结合项目进行简单的应用实践。 一、微前端背景 （一）什么是微前端 微前端提供了一种技术：可以将多个独立的Web应用聚合到一起，提供统一的访问入口。一个微前端应用给用户的感观就是一个完整的应用，但是在技术角度上是由一个个独立的应用组合通过某种方式组合而成的。 为了防止概念有点抽象，可以看一个具体的例子：上图是一个微前端的demo，主应用中有导航栏，footer组件以及
TypeScript 模块 TypeScript 模块的设计理念是可以更换的组织代码。
相信很多人都和我一样，刚接触babel的时候都是使用 babel-preset-es2015 这个预设套餐的，但是显然目前而言 babel-preset-env 会是一个更好的选择，babel-preset-env 可以根据配置的目标浏览器或者运行环境来自动将ES2015+的代码转换为es5。
最近需要在Angualr2建的项目里做一个pdf显示的功能，在网上找了个插件，不过由于是第一次使用额外插件，在用的时候遇到了一些坑，这里权且记一下使用的步骤，方便以后的参考。
在这篇文章中，我将介绍如何在 Node.js 中使用模块，重点是如何导出和消费它们。
最近写http://www.itoolshub.com/的时候用到了日期时间选择器,Angular本身material2只有日期选择器,也不知道为什么官方不提供日期时间选择器,也可能是Angular2以及如今的4有些年轻,很多库都不是很成熟,于是乎搜索到的解决方案就是借助第三方的库来使用一些优秀的组件.本文以https://github.com/sentsin/laydate组件为例.
Sentry 支持通过 source maps（源代码映射）对 JavaScript 进行 un-minifying，这允许您以原始的未转换形式查看从堆栈跟踪中获得的源代码上下文。这对于调试压缩后的代码(例如，UglifyJS)或从高级语言编译的代码(如 TypeScript 和 ES6)特别有用。
无论是前端开始后端，总会有很多概念。就拿这个前端模块加载机制来说，随着语言的发展，各种概念。
Module Federation就是一个JavaScript远程模块加载架构，即：Module federation allows a JavaScript application to dynamically run code from another bundle/build, on both client and server。
还记得在 Angular 2 Component 中使用第三方 JS 库这篇文章里说有个新项目用了 Angular2 么？这篇文章还是跟这个项目有关，为了减少每次访问页面的连接数（访问个首页居然会起 132 个连接！就算是调试时的情况也有点吓人了。。。），我用了 SystemJS builder 将整站打包成了单文件，然后另一个数字又狠狠糊了我一熊脸：这个 app.js 在经过 uglifyjs 压缩之后，容量居然还高达 1.2mb 。。。
0、机器学习系统 TensorFlow ★Star 62533 TensorFlow 是谷歌的第二代机器学习系统，按照谷歌所说，在某些基准测试中，TensorFlow的表现比第一代的DistBelie
通俗的来说， Source Map 就是一个信息文件，里面存储了代码打包转换后的位置信息，实质是一个 json 描述文件，维护了打包前后的代码映射关系。关于 Source Map 的解释可以看下 Introduction to JavaScript Source Maps[7]。
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
腾讯会议
实时音视频
