Signal 即将成为JavaScript的一部分

什么是响应性?

在过去的几年中,响应性成为了所有现代前端框架以及React库的核心。

对于不熟悉前端开发的人来说,起初这可能是一个令人困惑的概念,因为它改变了常规的、自上而下的、从调用者到被调用者的顺序工作流。

在响应性范式中,当事情发生变化时,数据会自动更新,下面简单展示一下伪代码:。


effect: console.log(x+2)
x = 2
x = 3

这种方法允许开发者以一种更直观的方式处理数据和UI的更新,使得用户界面能够实时反映底层数据的变化。

根据响应性范式,应用程序可以在变量x发生变化时,无需程序员的特别努力,就能显示NaN、4和5等多种结果。

这里极度简化了这个话题,只是为了给那些对响应性一无所知的人一个大致的了解。

需要指出的是,响应性在前端开发中的许多情况下都非常有用。例如,在显示用户界面时,一个框架可以识别变量何时发生变化以更新用户界面。比如当你展示一个实时的温度计时。

响应性的应用场景远不止于此,几乎所有的前端框架都在使用响应性技术。甚至还有一个响应式的jQuery库。

如何实现响应性?

响应性在实际应用中的一个很好的例子是电子表格。当你在电子表格中基于其他单元格的值输入一个计算公式时,你不需要手动更新计算结果。电子表格应用会自动检测到变化,并更新所有基于修改过的单元格的计算值。

在前端框架中,实现响应性有多种方法。一个著名的例子是使用RxJS,它依赖于观察者(Observables)、订阅者(Subscribers)和主题(Subjects)。如果你经常处理异步数据流,这是一个很棒的库。

在各种框架中,响应性的复杂性对开发者来说是隐藏的。

在React中,你必须明确提供依赖列表:

一旦reactive roomId 或 serverUrl 发生变化,上面的代码片段将会断开当前房间并连接到新的房间。

在Vue中,你甚至不需要提供依赖列表:

Vue会自行判断,如果copy.count发生变化,就应该重新运行代码。

如果我们审视所有主要的框架和库,会发现每个框架和库中的响应性几乎达到了相同的API水平,并且从用户的角度看几乎在做相同的事情。

Signals 的起源如何?

Angular进行的最后一次主要切换到类似的API是在2023年4月3日发布的一份RFC中详细说明的。该文档深入探讨了为什么zone.js的反应性不足,并且Angular必须转向更细粒度的Signals。

并不是说Signals在这方面完全是新事物,更多的是基于研究如何以最佳方式提供响应性的结论。我真的认为应该将Signals的来源归功于Solid。

自从那次重大工作完成以后,它巩固了整个社区对细粒度响应性的采纳。因为从那时起我们知道,几乎每个框架和库都使用几乎相同的响应性模型,但有些用的是tomato,有些则用的是tomato。

推动 Signal 标准化的努力

考虑到这一点,我们可以想象许多可能的结果。一切可能维持现状,每个框架使用自己的响应性模型。在这种情况下,人们实际上在使用不同名称下的相同事物。

另一个情景是,每个人突然使用提供响应性模型的库。到目前为止,这还没有发生,但它仍然是桌面上的一个选项。

第三个,也是最疯狂的情景,将是将 signals 纳入 Ecmascript 本身。这意味着它将成为 JavaScript 本身的一部分。

听起来疯狂吗?

确实。

但一切都在2023年2月一次偶然的 Twitter 聊天中浮出水面:每个人已经有或正在调整响应模型以基于 Signals 的模型。参与讨论的人之一是 Daniel Ehrenberg。

在过去的一年中,你真的不知道是否有什么事情正在酝酿,直到一个月前。

那时,Daniel 在纽约提议了一个名为 queerjs 的演讲,这个名字相当令人费解:

他提供了一个相当引人入胜的描述:

一种选择是通过使 Signals 内置到 JavaScript 中,如 Promises,来稳定生态系统,提高性能和互操作性。但是...最好避免像 Promises 那样的一些陷阱,例如它们始终开启的调度器。

这意味着,Daniel 真的在考虑 Signals 是否应该成为 JavaScript 的一部分!

Signals可能会成为JavaScript的一部分

总的来说,这些都还只是讨论阶段。但是在JavaScript世界里,事情发展迅速。甚至比C++成为一种内存安全的编程语言还要快,这是肯定的!

两天前,Daniel提议在4月的TC39会议上讨论这个主题。这意味着它可能很快就会进入第一阶段!

这是一件大事,因为TC39,即技术委员会39,负责标准化Ecmascript,而一旦某样东西成为标准的一部分,迟早会成为JavaScript的一部分!

当然,这不会像在周五晚上发布到生产环境那么简单。

Signals 可能需要时间才能成为 JavaScript 的标准功能

Signals 要成为 JavaScript 的标准功能,需要经过六个标准化阶段。因此,鉴于 Signals 的复杂性和响应性,这对整个委员会来说是一项艰巨的工作。但同时,它也将吸引包括前端框架开发者在内的许多开发者的关注。

在最佳情况下,他们所有人都应该满意于将来某天切换到 Signals。

但这需要仔细的工作和解决许多难题。例如,标准应该是开放的还是封闭的。

展望未来几年,我们可能会发现每个框架都使用标准的 JavaScript Signals。

这将有助于提高性能、可维护性,并能够将知识从一个框架转移到另一个框架。

许多好处确实可以让这种努力变得值得。

同时,这个过程也可能在任何时候被终止,所以目前一切皆有可能。

然而,我无法停止这种感觉,现在是推动 Signals 前进的绝佳时机。特别是知道从2024年3月18日开始,还有一个Observable/Subscription模型的孵化过程,Signals 可以从中受益。

Signal 提案刚刚发布!

Rob Eisenberg 和 Daniel Ehrenberg 刚刚发布了 Signal 标准的第0阶段提案。

已经有一个 polyfill 可供测试,而这个提案已经秘密开发了8个月!

作者成功地吸引了来自各种框架和库的作者参与:

他们在这里合作,开发了一个可以支持他们核心响应性需求的通用模型。当前的草案基于来自 Angular, Bubble, Ember, FAST, MobX, Preact, Qwik, RxJS, Solid, Starbeam, Svelte, Vue, Wiz 等作者/维护者的设计输入。

以下是一个如何使用 Signals 的例子:

const counter = new Signal.State(0);
const isEven = new Signal.Computed(
  () => (counter.get() & 1) == 0);
const parity = new Signal.Computed(
  () => isEven.get() ? "even" : "odd");

// 库或框架定义基于其他 Signal 原语的效果
declare function effect(cb: () => void): 
  (() => void);

effect(() => element.innerText 
  = parity.get());

// 模拟对计数器的外部更新...
setInterval(() => counter.set(
  counter.get() + 1), 1000);

这是多么令人震惊的简单易用啊!

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

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

OpenAI春季发布会速览,盘点近30天AI大事件

OpenAI发布会速览 北京时间5月14日凌晨1点,OpenAI在官网举行了"春季更新"活动,推出了全新的旗舰模型“GPT-4o”, 这款模型具备处理文本、图片、视频、语音的全能处理能力,能实时响应用户需求,并进行语音回应…

Altium Designer封装库和元器件符号库下载与导入教程(SnapEDA 、Ultra Librarian、Alldatasheetcn)

1.AD封装库和元器件符号库下载网址 以下是一些全球热门的Altium Designer封装库和元器件符号库下载网址推荐: Altium Content Vault (现称为Altium Manufacturer Part Search):这是Altium官方提供的元器件库,可以直接在Altium Designer中使用…

腾讯开源混元DiT文生图模型,消费级单卡可推理

节前,我们组织了一场算法岗技术&面试讨论会,邀请了一些互联网大厂朋友、今年参加社招和校招面试的同学。 针对大模型技术趋势、大模型落地项目经验分享、新手如何入门算法岗、该如何准备面试攻略、面试常考点等热门话题进行了深入的讨论。 总结链接…

层次式体系结构概述

1.软件体系结构 软件体系结构可定义为:软件体系结构为软件系统提供了结构、行为和属性的高级抽象,由构成系统的元素描述、这些元素的相互作用、指导元素集成的模式以及这些模式的约束组成。软件体系结构不仅指定了系统的组织结构和拓扑结构,并…

速度与激情:Redis如何以核心数据结构驱动极致性能

关注微信公众号 “程序员小胖” 每日技术干货,第一时间送达! 引言 Redis是一个开源的内存数据结构存储系统,它支持多种类型的数据结构,如字符串、散列、列表、集合、有序集合等。Redis以其出色的性能和低延迟特性而闻名&#xf…

最小质数对-第12届蓝桥杯国赛Python真题解析

[导读]:超平老师的Scratch蓝桥杯真题解读系列在推出之后,受到了广大老师和家长的好评,非常感谢各位的认可和厚爱。作为回馈,超平老师计划推出《Python蓝桥杯真题解析100讲》,这是解读系列的第63讲。 最小质数对&#…

【软考】模拟考卷错题本2024-05-14

1 活动图-计算时间差 审题,第几天~选的3、10是结束了上一次的活动并未开始呢 !所以记得按照正常的语序表达哦! 2 队列-算长度 代入法,设计一个开始为0,结尾为9 ,容量为10即M的队列;带入计算当前…

【车载开发系列】AutoSar中的Port

【车载开发系列】AutoSar中的Port 一. Port概念 AutoSAR 接口定义了 SWC 之间、BSW 模块之间以及 SWC 和 BSW 模块之间交互的信息。AutoSAR 接口通过 SWC 和/或 BSW 模块端口(Port)的形式实现。通过这些端口,SWC 和 BSW 模块之间实现了数据…

MYSQL SQL3

1.DCL:Global level 所有库,所有表的权限 Database level:某个数据库中所有表的权限 Table level: 库中某个表的权限 Column level:表中的某个字段的权限 管理:创建用户create user 用户名localhost(ip地址,“%”除了本机登录其他的都可以登录…

iOS ------ 多线程基础

一,进程和线程 1,进程 定义: 进程是指在系统中正在运行的一个应用程序每个进程之间是独立的,每个进程均运行在其专有的且受保护的内存进程是系统进行资源分配和调度的一个独立单位 补充:iOS系统是相对封闭的系统&a…

(C语言)队列实现与用队列实现栈

目录 1.队列 1.1队列的概念及结构 1.2 队列的实际应用联想 1.3队列的实现 2. 队列应用——队列实现栈 主要思路 1.队列 1.1队列的概念及结构 队列:只允许在一端进行插入数据操作,在另一端进行删除数据操作的特殊线性表,队列具有先进…

内网渗透瑞士军刀-impacket工具解析(二)

impacket工具解析之Kerberos认证协议 上一期我们介绍了impacket中ntlm协议的实现,在Windows认证中除了使用ntlm认证,还支持Kerberos认证协议,Kerberos认证也是Windows 活动目录中占比最高的认证方式。 什么是Kerberos协议? Kerb…

什么?你设计接口什么都不考虑?

如果让你设计一个接口,你会考虑哪些问题? 1.接口参数校验 接口的入参和返回值都需要进行校验。 入参是否不能为空,入参的长度限制是多少,入参的格式限制,如邮箱格式限制 返回值是否为空,如果为空的时候是…

第 397 场 LeetCode 周赛题解

A 两个字符串的排列差 模拟&#xff1a;遍历 s s s 记录各字符出现的位置&#xff0c;然后遍历 t t t 计算排列差 class Solution {public:int findPermutationDifference(string s, string t) {int n s.size();vector<int> loc(26);for (int i 0; i < n; i)loc[s…

红黑树底层封装map、set C++

目录 一、框架思考 三个问题 问题1的解决 问题2的解决&#xff1a; 问题3的解决&#xff1a; 二、泛型编程 1、仿函数的泛型编程 2、迭代器的泛型编程 3、typename&#xff1a; 4、/--重载 三、原码 红黑树 map set 一、框架思考 map和set都是使用红黑树底层&…

半监督的GCN:Semi-Supervised Classification With Graph Convolutional Networks

Semi-Supervised Classification With Graph Convolutional Networks -Theophilus Siameh-2017(2023) 思路 使用可扩展方法对图进行半监督学习,其中CNN应用在图数据上,得到GCN。 这种方法是在图的边的数量上进行线性的缩放模型,并学习包含局部图结构和图节点的几个隐藏层…

DiskANN数据布局

_mem.index.data&#xff1a;和sift_base.fbin一模一样。0-3字节是总向量数&#xff0c;4-7是每个向量的特征数。后面就是依次放置的每个向量。 _disk.index&#xff1a;是存储的图&#xff0c;但是不光包含图也包含原始向量。前4KB不知道存的是啥。从第0x1000开始存放的是原始…

【Python大数据】PySpark

CSDN不支持多个资源绑定&#xff0c;另外两个数据文件下载&#xff1a; 订单数据-json.zip search-log.zip Apache Spark是用于大规模数据(large-scala data)处理的统一(unified)分析引擎 简单来说&#xff0c;Spark是一款分布式的计算框架&#xff0c;用于调度成百上千的服…

【Unity之FairyGUI】你了解FGUI吗,跨平台多功能高效UI插件

&#x1f468;‍&#x1f4bb;个人主页&#xff1a;元宇宙-秩沅 &#x1f468;‍&#x1f4bb; hallo 欢迎 点赞&#x1f44d; 收藏⭐ 留言&#x1f4dd; 加关注✅! &#x1f468;‍&#x1f4bb; 本文由 秩沅 原创 &#x1f468;‍&#x1f4bb; 收录于专栏&#xff1a;就业…

动手学深度学习19 卷积层

动手学深度学习19 卷积层 1. 从全连接到卷积2. 卷积层3. 代码4. QA 1. 从全连接到卷积 视频&#xff1a; https://www.bilibili.com/video/BV1L64y1m7Nh/?spm_id_from333.999.0.0&vd_sourceeb04c9a33e87ceba9c9a2e5f09752ef8 3.6B元素 36亿元素–模型参数&#xff0c;存储…