微软正在放弃React

news2024/10/6 11:30:05

最近,微软Edge团队撰写了一篇文章,介绍了微软团队如何努力提升Edge浏览器的性能。但在文中,微软对React提出了批评,并宣布他们将不再在Edge浏览器的开发中使用React。

我将详细解析他们的整篇文章内容,探讨这一决定对React、JavaScript开发者的影响,以及微软Edge团队背后的真正意图。

一、历史背景

微软Edge浏览器是基于Chromium构建的,Chromium是谷歌的一个开源网络浏览器项目。微软Edge的默认用户界面来源于Chromium。

显而易见,微软不希望Edge看起来像Chrome。因此,Edge拥有一套由微软设计的用户界面组件和元素。然而,这些组件是利用React开发的。

Edge中的许多小部件都是通过React创建的,它们共同构成了整个浏览器。

实际上,Edge浏览器并非一个彻头彻尾的React项目。它更像是一个精巧的拼图,通过HTML页面巧妙地嵌入了多个React驱动的小部件,诸如菜单、下拉列表以及收藏夹标签,都藏着React编织的小魔法。

可这样的做法并不那么灵光,尤其是面对那些鲜少变动的UI信息时,显得有点力不从心。其效率低下导致微软开始对React产生质疑。

但这个故事远未揭开全部真相。我们很快就会发现,到底是React有问题,还是微软在设计上存在人为缺陷。

二、问题所在

微软声称React效率不高,因此他们进行了改进,并于2024年5月28日发布的一篇文章中宣布了这一消息。

微软注意到,多个组件间共享的捆绑包过大,这导致了浏览器运行速度减慢。

理论上,这些组件不应共用一个捆绑包,但既然微软指出了这个问题,以下是他们的理由:

1.UI代码存在模块化问题。不同组件团队不当共享了通用代码包和文件,导致UI界面中一个区域因加载了不必要的共享资源而拖累了另一个区域的加载速度。

2.微软采用了一个框架,该框架依赖JavaScript,通过客户端渲染技术来呈现UI。微软声称,这是导致其浏览器速度变慢的第二个原因。

如前所述,Edge浏览器中集成了多个React应用。

他们并未启动多个React项目,而是在多个位置使用了一个单一的JavaScript包,并将该包挂载到了许多组件中的多个属性上。

而第二个原因正是我撰写本文的缘由。微软间接地指出,React正是导致其代码包问题的框架。

图片

图片

          

微软时不时提及React,是因为他们正全速推进像React Native这样针对Windows、MacOS乃至Xbox的项目。但对于Edge浏览器,React似乎成了他们不愿触及的“逆鳞”。

即便是亲手操刀React Native的开发,微软也迟迟未让其涉足Edge的领地。作为一款原生桌面应用,Edge与React Native看似天作之合,但微软对此有不同的看法。   

过去,借助HTML、CSS、JavaScript,乃至React来搭建菜单、下拉框等界面元素,是业界的“金科玉律”。而今,微软决意转身,背后自有一番深思熟虑的考量。

图片

图片

在过去,菜单及其选项通常是独立的HTML文件。每个执行特定操作的按钮或链接都会重定向到一个HTML文件。

然而,这种旧模式主要适用于诸如菜单之类的组件。但显然,微软并未完全理解这一点。

他们为每个简单的组件使用带有React的HTML文件。每个HTML文件都需要JavaScript。并且,他们将这些JavaScript代码作为捆绑包与每个团队共享。

微软将多个HTML页面(在React应用中)嵌入浏览器中以控制整个用户界面。现在,他们正在寻找解决这两个问题的办法。

三、解决方案

首先,问题并不在于React本身,而是微软错误地实施了它。

理想的状况下,每个代码包应服务于特定的网页,独立地完成其功能。每个页面可以有自己的独立代码包或集合。

但是,当你在不同团队的工作中共享相同的代码包或文件时,混乱几乎是必然的。每个团队都在访问和修改相同的代码包。

结果不出所料。React并非不适合他们的用途,而是他们使用方式不当。React本身并不慢,但当你创建了数十个实例时,就不能指望它还能保持极高的运行速度。

微软针对自己造成的问题提出了解决方案:他们创建了一个自定义框架。

微软宣布了WebUI 2.0——这是一种以标记优先的架构。它通过最小化代码包的大小及初始化路径中运行的JavaScript量,解决了代码包过大的问题。

微软已开始使用这一新架构来解决我前面提到的两个问题。他们错误地使用了React,忽略了React Native的存在,并解决了一个本可避免的问题。

起初,他们在每个组件中使用了含有React的独立HTML文件。然后,他们将每个HTML文件所需的JavaScript代码卸载到了一个共享包中,这个包同时供其他十个团队使用。而现在,他们不再使用React了。

对此,你怎么看呢?可以把你的想法写在评论区。 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/1903486.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

QML:Settings介绍

用途 提供持久的独立于平台的应用程序设置。 用户通常希望应用程序在会话中记住其设置(窗口大小、位置、选项等)。Settings能够以最小的工作量保存和恢复此类应用程序设置。 通过在Settings元素中声明属性来指定各个设置值。仅支持由QSettings识别的值…

Gemma2——Google 新开源大型语言模型完整应用指南

0.引言 Gemma 2以前代产品为基础,提供增强的性能和效率,以及一系列创新功能,使其在研究和实际应用中都具有特别的吸引力。Gemma 2 的与众不同之处在于,它能够提供与更大的专有模型相当的性能,但其软件包专为更广泛的可…

《梦醒蝶飞:释放Excel函数与公式的力量》9.3.1PV 函数

9.3.1 函数简介 PV函数用于计算一系列未来付款的现值,考虑了一定的利率。现值是未来金额的贴现值,表示在当前时刻相当于未来某一时间点的总价值。 9.3.2 语法 PV函数的语法如下: PV(rate, nper, pmt, [fv], [type]) rate:每期…

JavaEE初阶-网络原理1

文章目录 前言一、UDP报头二、UDP校验和2.1 CRC2.2 md5 前言 学习一个网络协议,最主要就是学习的报文格式,对于UDP来说,应用层数据到达UDP之后,会给应用层数据报前面加上UDP报头。 UDP数据报UDP包头载荷 一、UDP报头 如上图UDP的…

中英双语介绍美国苹果公司(Apple Inc.)

中文版 苹果公司简介 苹果公司(Apple Inc.)是一家美国跨国科技公司,总部位于加利福尼亚州库比蒂诺。作为全球最有影响力的科技公司之一,苹果以其创新的产品和设计引领了多个科技领域的变革。以下是对苹果公司发展历史、主要产品…

算法刷题笔记 滑动窗口(C++实现,非常详细)

文章目录 题目描述基本思路实现代码 题目描述 给定一个大小为n ≤ 10^6的数组。有一个大小为k的滑动窗口,它从数组的最左边移动到最右边。你只能在窗口中看到k个数字。每次滑动窗口向右移动一个位置。以下是一个例子: 该数组为 [1 3 -1 -3 5 3 6 7]&…

SAP PS学习笔记02 - 网络,活动,PS文本,PS文书(凭证),里程碑

上一章讲了PS 的概要,以及创建Project,创建WBS。 SAP PS学习笔记01 - PS概述,创建Project和WBS-CSDN博客 本章继续讲PS的后续内容。包括下面的概念和基本操作,以及一些Customize: - 网络(Network&#xf…

CC工具箱使用指南:【相交占比分析】

一、简介 需求场景如下,有【待分析地块】和【面积占比参考】2个图层。2个图层之间存在空间上的重叠。工具的目的是为了分析出【待分析地块】的每1个图斑中,和【面积占比参考】相交的面积,以及和总面积的占比。 举一个应用场景为例&#xff0…

java信号量(Semaphore)

Java中的信号量(Semaphore)是一种用于控制多个线程对共享资源的访问的同步工具。它可以用来限制可以同时访问某些资源的线程数量。Semaphore 提供了一个计数器来管理许可证的获取和释放,每个许可证代表对资源的一次访问权限。 import java…

阶段三:项目开发---搭建项目前后端系统基础架构:任务11:搭建项目后台系统基础架构

任务描述 1、了解搭建民航后端框架 2、使用IDEA创建基于SpringBoot、MyBatis、MySQL、Redis的Java项目 3、以原项目为参照搭建项目所涉及到的各个业务和底层服务 4、以原项目为例,具体介绍各个目录情况并参照创建相关文件夹 任务指导 1、讲框架的选择和原理 …

解决Unable to Correct Problems ‘You have Held Broken Packages’

进入 Software & Updates 后下拉 Download from,点击 Other… 点击 Select Best Server 等待测试服务器 测试完成后会默认标红测试出的最好的那个服务器,直接点击 Choose Server,可能需要输入系统用户密码5. 输入然后返回上级界面 点击 C…

实现ubuntu的任务计划反弹shell

1.实验目的 使用Ubuntu定时任务反弹shell 2实验环境 ubuntu:ip地址:192.168.80.133 kali:ip地址:192.168.80.134 3.编写crontab计划任务 在ubuntu的系统中使用crontab -e命令编写计划任务 作用:是将一个交互式的…

STM32利用FreeRTOS实现4个led灯同时以不同的频率闪烁

在没有接触到FreeRTOS时,也没有想过同时叫两个或两个以上的led灯闪烁的想法,接触后,发现如果想叫两个灯同时以不同的频率闪烁,不能说是不可能,就算是做到了也要非常的麻烦。但是学习了FreeRTOS后,发现要想同…

26 华三防火墙安全区域

防火墙区域规划 配置网络网卡的地址在同一网段 第一个问题 为什么防火墙直连在同一个网段ping不通? 配置IP地址 local区域: 将local区域的所有接口启用 华三防火墙的local区域是指设备本地接口所在的区域,也称为局域网(LAN)或内部网络 Int…

机器学习与深度学习:区别(含工作站硬件推荐)

一、机器学习与深度学习区别 机器学习(ML:Machine Learning)与深度学习(DL:Deep Learning)是人工智能(AI)领域内两个重要但不同的技术。它们在定义、数据依赖性以及硬件依赖性等方面…

硬件开发笔记(二十四):贴片电容的类别、封装介绍,AD21导入贴片电容、原理图和封装库3D模型

若该文为原创文章,转载请注明原文出处 本文章博客地址:https://hpzwl.blog.csdn.net/article/details/140241817 长沙红胖子Qt(长沙创微智科)博文大全:开发技术集合(包含Qt实用技术、树莓派、三维、OpenCV…

VUE3初学入门-02-VUE创建项目

创建VUE项目的另一个方法 三种方法通过vue-cli进行创建通过npm进行创建比较 部署到nginx修改配置生成部署文件 三种方法 上一篇是在VSCODE中建立工作区,然后创建,属于命令加鼠标方式。个人感觉,在VSCODE基本上都是这样的操作,不是…

C++模板元编程(一)——可变参数模板

这个系列主要记录C模板元编程的常用语法 文章目录 引言语法应用函数模板可变参数的打印可变参数的最小/最大函数 类模板 参考文献 引言 在C11之前,函数模板和类模板只支持含有固定数量的模板参数。C11增强了模板功能,允许模板定义中包含任意个(包括0个)…

Pytorch 实践手写数字识别深度学习网络 LeNet-5

Pytorch 实践手写数字识别深度学习网络 LeNet-5 文章目录 Pytorch 实践手写数字识别深度学习网络 LeNet-5认识 LeNet-5认识数据集处理数据集下载数据集读取数据定义Dataset的继承类把数据进行载入载入dataloader 编写网络编写训练与测试代码实践结果展示完整代码 训练手写体识别…

什么是反射?

什么是反射? 1、反射的基本概念2、 获取Class对象3、获取类的成员变量、方法和构造方法3.1 获取成员变量3.2 获取方法3.3 获取构造方法3.4 动态调用方法 4、反射的优缺点 💖The Begin💖点点关注,收藏不迷路💖 反射&…