前端周报：Airbnb 宣布放弃使用 React Native，Vue超越了React？

策划｜覃云

前端每周清单专注大前端领域内容，帮助开发者了解一周前端热点；分为新闻热点、开发教程、工程实践、深度阅读、开源项目等栏 目。欢迎关注【前端之巅】微信公众号（ID: frontshow），及时获取前端每周清单。

由于微信不支持外链，所以，请在文末点击阅读原文，获取带链接版本的文章。

新闻热点

国内国外，前端最新动态

Vue.js 超越 React.js？勿以 star 数论高低！：近日，在前端的 JavaScript 框架世界发生了一件称得上是“里程碑”的事：Vue.js 在 GitHub 上的 star 数量终于超过了 React.js 的 star 数量，并在不久之后双双破了 10W。

纵观过去两年的数据，我们可以看到，与 github 的 star 数形成鲜明对比的是，根据 NPM 软件包的下载量来衡量，React 仍然在实际使用方面占据主导地位。它即将超过每月 1000 万的巨大下载量，并且还一直保持着高速的增长。

但在过去的两年中，Vue 的增长速度比其他任何主流的 JavaScript 框架都快，最近赶上了 Angular.js，并逐渐缩小了它与 Angular 和 React 之间的差距。

Airbnb 宣布放弃使用 React Native，回归使用原生技术：6 月 20 日，Airbnb 技术团队在 Medium 上宣布，Airbnb 放弃使用 React Native，将回归到使用基于原生技术的自有框架开发 App。

Airbnb 表示，尽管很多团队都依赖 React Native 并计划在可预见的将来使用它，但他们最终还是无法实现最初的目标。Airbnb 放弃使用 React Native 的主要原因是 React Native 未能实现完全的跨平台抽象，有时候仍然需要针对特定平台单独编写代码来解决问题。这就间接要求他们的工程师必须熟悉三个平台才能真正用好 React Native，然而绝大多数开发者只熟悉一两个平台，久而久之便引发了一系列的问题。

Google 发布 Flutter 预览版：6 月 21 日，在北京 GMTC 大前端大会上，Google Flutter 高级工程师于潇宣布 Flutter Release Preview 1 发布，并宣布与阿里巴巴闲鱼团队在 Flutter 上合作，这标志着 Flutter 进入了一个新阶段。在 Google I/O 大会之后，Flutter 生态得到了快速地增长，Flutter 的活跃用户增长了 50%，不仅如此，在 I/O 大会之后的几周内，在全世界范围内，已有超过 150 个与 Flutter 相关的事件发生。

Flutter 团队表示，Flutter 从 beta 版本到现在的 Release Preview 1，都体现了他们对稳定性和质量的信心和关注。

开发教程

步步为营，掌握基础技能

大话大前端时代：Vue 与 iOS 的组件化（上）：笔者是一名普通的全职 iOS 开发者，在接触到了前端开发以后，发现了前端有些值得移动端学习的地方，于是便有了这个大前端时代系列的文章，希望两者能相互借鉴优秀的思想。谈及到大前端，常常被提及的话题有：组件化，路由与解耦，工程化（打包工具，脚手架，包管理工具），MVC 和 MVVM 架构，埋点和性能监控。笔者先从组件化方面谈起，以前端和移动端（以 iOS 平台为主）对比为主，看看这两端的不同做法，并讨论有无相互借鉴学习的地方。

服务端与客户端同构 —— Vue.js 应用框架 Nuxt.js：很多现代的 JavaScript 框架，比如 Vue.js, 旨在构建单页应用 (SPA)。单页应用的优势在于，改善用户体验，让网页速度更快，像 APP 一样流畅，即使更新。虽然单页应用优点很多，但是由于依赖多导致首屏渲染慢，无法做 seo 优化也是让人头疼的问题。

服务端渲染是指，提前将页面在服务器端渲染好，当浏览器请求服务器时，直接返回渲染好的 html 页面返回。构建服务端渲染的 JavaScript 程序多少有些无趣，在开始编码之前，需要大量的基础配置。因此，解决 vue.js 服务端渲染问题的 Nuxt.js 产生了。

通过本文，你讲学习到如何利用 Nuxt.js 搭配 Vue.js 构建服务端渲染的 JavaScript 应用程序。还学会如何使用其 generate 命令来生成我们页面的静态文件，并且，可以利用 Firebase Hosting 这样的静态托管工具部署。

工程实践

立足实践，提示实际水平

美团外卖 Android Crash 治理之路：Crash 率是衡量一个 App 好坏的重要指标之一。如果你忽略了它的存在，它就会得寸进尺，愈演愈烈，最后造成大量用户的流失，进而给公司带来无法估量的损失。本文讲述美团外卖 Android 客户端团队在将 App 的 Crash 率从千分之三做到万分之二过程中所做的大量实践工作，抛砖引玉，希望能够为其他团队提供一些经验和启发。

太平洋保险 CIMS 系统微前端实践：微前端的概念最早由 ThoughtWorks 在 2016 年底提出，是一种将微服务推广到前端的设计理念。（https://micro-frontends.org/），目前的趋势是构建一个功能丰富且功能强大的浏览器应用程序，也就是位于微服务架构之上的单页应用程序（SPA）。

微前端可以有效的降低前端的代码复杂度和更加灵活的解耦，甚至可以很好的组合当前流行的各种前端框架，例如 Vue，React，Angluar。同时, 微前端服务可以有自己的独立生命周期。在本文中，作者将告诉我们太平洋保险是如何利用微前端改造 CIMS 系统的。

苏宁金融移动端登录优化之道：在登录优化过程中，苏宁金融秉持“图难于其易，为大于其细的思想”，已经达成登录响应时间、成功率及用户体验的提升。本文主要从如下几个方面介绍苏宁金融移动端登录优化的道和术：找到登录优化之道、完善系统的监测和度量、梳理登录的每个环节、优化登录的各个环节。

大型网站的 HTTPS 实践：协议层以外的实践：百度已经上线了全站 HTTPS 的安全搜索，默认会将 HTTP 请求跳转成 HTTPS。百度 HTTPS 性能优化涉及到大量内容，在前端页面、后端架构、协议特性、加密算法、流量调度、架构和运维、安全等方面都做了大量工作。本系列文章将对此一一进行介绍。

深度阅读

深度思考，升华开发智慧

浅谈使用 Vue 构建前端 10w+ 代码量的单页面应用开发底层：本文会在主要描述以 Vue 技术栈为技术主体，ToC 端项目业务主体，在构建过程中，遇到或者总结的点（也会提及一些 ToB 项目的场景）。主要包括选择单页面还是多页面，全局配置、插件与拦截器，以及路由配置与懒加载等。

深入理解 JavaScript this：要说 JavaScript 这门语言最容易让人困惑的知识点，this 关键词肯定算一个。JavaScript 语言面世多年，一直在进化完善，现在在服务器上还可以通过 node.js 来跑 JavaScript。显然，这门语言还会活很久。

所以说，如果你是一个 JavaScript 开发者或者说 web 开发者，学好 JavaScript 的运作原理以及语言特点肯定对你以后大有好处。不过你首先需要学变量作用域和作用域提升、JavaScript 的函数、闭包这些基础知识才能更好地理解 this。

开源项目

乐于分享，共推前端发展

JSUI：JSUI 是一个强大的用于管理 JavaScript 应用程序的 UI 工具包，无论是前端还是后端应用程序，也不管用什么框架，如果它有 package.json，就能使用这个库。

vue-native-core：vue-native 是一个使用 JavaScript 构建跨平台原生移动应用程序的框架。它用 Vue Native CLI 生成 Vue Native 应用程序，这意味着 Vue Native 可以做任何 React Native 能做的事。

spritejs：SpriteJS 是一款由 360 奇舞团开源的跨终端 canvas 绘图框架，可以基于 canvas 快速绘制结构化 UI、动画和交互效果，并发布到任何拥有 canvas 环境的平台上（比如浏览器、小程序和 node）。

前端之巅

「前端之巅」是 InfoQ 旗下关注大前端技术的垂直社群。紧跟时代潮流，共享一线技术，欢迎关注。

前端之巅

InfoQ大前端技术社群