前端食堂技术周刊第 72 期:Signals 是前端框架的未来、Chrome Headless、ts-reset、magic-regexp、Bun 新文档

news2024/12/27 2:19:29

美味值:🌟🌟🌟🌟🌟

口味:草莓番茄

  • 食堂技术周刊仓库地址:https://github.com/Geekhyt/weekly

本期摘要

  • Signals 是前端框架的未来
  • Chrome Headless 进化成完全体
  • Next.js 13.2
  • Deno 1.31
  • Bun 新文档上线
  • ts-reset
  • TypeScript Brand type with Zod
  • 字节跳动 DevOps 交付流程演进之路
  • magic-regexp

大家好,我是童欧巴。欢迎来到前端食堂技术周刊,我们先来看下上周的技术资讯。

技术资讯

1. Signals 是前端框架的未来

Builder.io 的 CTO、Angular、Qwik 的作者 Miško Hevery 近日发文表示 Signals 是前端框架的未来。

尤大也在 Vue 官网上添加了 Connection to Signals 部分。将目前实现 Signals 的框架:Solid、Angular、Preact、Qwik 与 Vue 进行了一波对比。

其中 Preact 和 Qwik 的 API 设计与 Vue 的 shallowRef 类似。Solid 的 createSignal() API 设计强调了读、写隔离,暴露 getter、setter。Angular 放弃了脏检查,引入了自己的响应式实现

与 Vue 的 refs 相比,Solid 和 Angular 基于 getter 的 API 风格提供了一些有趣的权衡:

  • () 虽然比 .value 写起来更省事儿,但是更新值的时候比较啰嗦。
  • 没有 ref-unwrapping(解包),访问值总是需要 (),这使得值在任何地方访问都是一致的。这也意味着你可以将原始的 signals 作为组件的 props 传递下去。

用 Vue 的 shallowRef 和 triggerRef 也可以实现类似 Solid 和 Angular 的 API。

2. Chrome Headless 进化成完全体

Chrome Headless 无头模式进化成完全体,支持浏览器插件等浏览器级别的功能,利好自动化测试。

3. Next.js 13.2

  • 内置 SEO 支持:Metadata API
  • 自定义 Route Handlers
  • 服务器组件支持 MDX
  • Rust 实现的 MDX Parser
  • Error Overlay 改进
  • Link 类型安全 (Beta)
  • 改进 Turbopack 与 Webpack loader 的兼容性 (Alpha)
  • Next.js Cache (Beta)

4. Deno 1.31

  • 支持 package.json
  • Node-API 稳定
  • 对 Node 的兼容层已经嵌入到运行时,性能得到提升,减少维护成本
  • 远程模块支持 npm specifiers,无须传入 --unstable 标志

5. Bun 新文档上线

下面我们来看技术资料。

技术资料

1. ts-reset

TypeScript 的 “CSS reset”,用于完善常见的 JS API 的类型。

2. TypeScript Brand type with Zod

Brand Type + 类型守卫 = 更安全的类型

Brand Type 说白了就是模拟名义子类型结构,保证代码调用的类型安全,再通过类型谓词 is 实现类型守卫做数据验证的逻辑,双重安全。(数据验证推荐使用 Zod)

3. 字节跳动 DevOps 交付流程演进之路

交付流程源于一系列现实的复杂性,如:业务、团队、技术,大公司的业务和团队会更加多元,技术也会更加复杂。

看字节如何破局:通过开放共建的流水线体系为底座,打造业务可自定义的自动化和协同流程。

  • 开放共建:集中兵力优化通用工具和关键链路,业务可以自己定制工具,减少依赖,快速达成业务目标
  • 三套交付流程:自动化为特点的单服务流水线、协同视图为特点的需求交付模式和版本火车模式
  • 平台层:标准的对接体系、流水线的标准化、原子服务的标准化、变量参数的标准化,对接各种基建能力
  • 自动化:提升单点自动化效率,建设自动化工具链串联起单点,优化人工和自动化的协作流程
  • 流水线:API 和 Hook 能力、原子服务市场、模版市场、变量系统、决策节点
  • 以价值流为主线的协同模式:全流程模式(自测流程、简化流程、标准流程、紧急流程)、火车模式
  • 落地策略:抓住有利时机、定义足够业务收益、团结利益相关人

4. magic-regexp

符合人体工程学的正则替代品,类型安全,爽。

好了,以上就是本期的食堂周刊,观众老爷们如果觉得还不错,一键三连是对食堂老板最大的支持。

你的前端食堂,吃好每一顿饭,我们下期见。

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

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

相关文章

纯x86汇编实现的多线程操作系统实践 - 第二章 BSP的启动

本章主要讲解BSP的初始化过程,对应的代码为mbr.asm。系统加电启动后,BIOS进行必要的初始化,并将硬盘的0扇区512字节的数据搬运到内存地址0x7c00处。之后,BSP的IP被置为0x7c00,开始运行。初始化代码mbr.asm将顺序执行以…

服务网格领域的百花齐放

服务网格是一种技术架构,它用于管理微服务系统中各个服务之间的通信,旨在处理微服务间的流量(也称为东西向流量)。 ​ 在云原生应用中,一个应用的背后可能存在着成百上千个服务,各个服务可能又有着若干个实…

机器学习——集成学习

引言 集成学习:让机器学习效果更好,单个不行,群殴走起。 分类 1. Bagging:训练多个分类器取平均(m代表树的个数)。 2.Boosting(提升算法):从弱学习器开始加,通过加权来进行训练。…

这样在管理后台里实现 403 页面实在是太优雅了

前言403 页面通常表示无权限访问,与 404 页面代表着不同含义。而大部分管理后台框架仅提供了 404 页面的支持,但却忽略了对 403 页面的处理,有的框架虽然也有对 403 页面的处理,但处理效果却不尽人意。那怎么样的 403 页面才是即好…

异步交互的关键——Ajax

文章目录1,Ajax 概述1.1 作用1.2 同步和异步1.3 案例1.3.1 分析1.3.2 后端实现1.3.3 前端实现2,axios2.1 基本使用2.2 快速入门2.2.1 后端实现2.2.2 前端实现2.3 请求方法别名最后说一句1,Ajax 概述 AJAX (Asynchronous JavaScript And XML):异步的 Jav…

【Fastdfs实战】在本地如何将文件上传到Linux虚拟机

作者:狮子也疯狂 专栏:《Fastdfs连续剧》 坚持做好每一步,幸运之神自然会驾凌在你的身上 目录一. 🦁 前言二. 🦁 上传原理Ⅰ. 🐇 原理图解Ⅱ. 🐇 传输原理三. 🦁 实战演示Ⅰ. &…

TryHackMe-CVE-2021-41773/42013(Apache2.4.49/50)

CVE-2021-41773/42013 对 Apache 路径遍历错误的简短解释和不完整的修复 介绍 tryhackme: 在 Apache HTTP Server 2.4.49 中对路径规范化所做的更改中发现一个缺陷。攻击者可以使用路径遍历攻击将 URL 映射到预期文档根目录之外的文件。如果文档根目录之外的文件不受“要求全…

第三阶段-03MyBatis 中使用XML映射文件详解

MyBatis 中使用XML映射文件 什么是XML映射 使用注解的映射SQL的问题: 长SQL需要折行,不方便维护动态SQL查询拼接复杂源代码中的SQL,不方便与DBA协作 MyBatis建议使用XML文件映射SQL才能最大化发挥MySQL的功能 统一管理SQL, 方…

【工程实践】python 去除\xa0、\u3000、\n、\u2800、\t等字符

1.问题描述 在处理数据时,会遇到\xa0、\u3000、\u2800、\t等Unicode字符串。需要对其进行处理。 2.空格类型说明 空格可以分为两类,一类为普通文本空格,另一类为html实体空格。普通文本空格介绍普通半角空格和普通全角空格。html实体空格介绍…

【反序列化漏洞-01】为什么要序列化

为什么要序列化百度百科上关于序列化的定义是,将对象的状态信息转换为可以存储或传输的形式(字符串)的过程。在序列化期间,对象将其当前状态写入到临时或持久性存储区(非关系型键值对形式的数据库Redis,与数组类似)。以后,可以通过…

浅谈信安文章搜索引擎

一个搜索引擎的实现流程大概为:首先获取海量的数据,整理成统一的格式,然后交给索引程序建立索引,当索引建立好后,就可以进行搜索。简而言之就是:数据获取->数据检索->数据搜索 0x1数据获取 数据获取…

RK3399+FPGA+MIPI 方案细节之subLVDS to MIPI处理

#CROSSLINK系列 #CROSSLINK vs XO3L 总的来说XO3L的灵活性更强,更近似于一片通用的CPLD;CROSSLINK专用性更强。 针对subLVDS转换到MIPI的需求,CROSSLINK比较有优势,因为集成度更高,所以稳定性也更高。 #要点 #crossl…

死锁的总结

哲学家死锁造成的原因:我有你需要的,但你已经有了 饥饿与死锁的区别 死锁一旦发生一定又饥饿现象,但是饥饿现象产生不一定是死锁 历史上对于死锁的声音 死锁的方案 前面两个都是不允许死锁出现 前面都是概念性的东西 后面我们研究如何破坏…

【vue】vuex数据丢失怎么办?盘一盘vue传值的方法

【问题描述】 vuex的 store 中的数据是保存在运行内存中的,当页面刷新时,页面会重新加载 vue 实例,vuex 里面的数据就会被重新赋值,这样就会出现页面刷新vuex中的数据丢失的问题。 如何解决浏览器刷新数据丢失问题呢? …

Java-Springboot整合支付宝接口

文章目录一、创建支付宝沙箱二、使用内网穿透 nat app三、编写java程序四、访问一、创建支付宝沙箱 跳转 : 支付宝沙箱平台 1、进入控制台 2、创建小程序,编写名称和绑定商家即可 3、返回第一个页面,往下滑进入沙箱 4、进行相关的配置&a…

git push -u参数是什么意思?

背景 git push的时候,有时候会用-u参数,有时候不适用。这是为什么呢? 官方解释 -u--set-upstreamFor every branch that is up to date or successfully pushed, add upstream (tracking) reference, used by argument-less git-pull(1) a…

【 Java 组 】蓝桥杯省赛真题 [世纪末的星期] [幸运数] (持续更新中...)

个人简介:Java领域新星创作者;阿里云技术博主、星级博主、专家博主;正在Java学习的路上摸爬滚打,记录学习的过程~ 个人主页:.29.的博客 学习社区:进去逛一逛~ 蓝桥杯真题--持续更新中...一、世纪末的星期二…

【设计模式】策略模式在Java工程中应用

在之前的文章中,曾经给大家介绍过策略模式:【设计模式】策略模式,在该篇文章中,我们曾很清楚的说到,策略模式主要解决的问题是:在有多种算法相似的情况下,解决使用 if...else 所带来的复杂和难以…

【Spring从成神到升仙系列 一】2023年再不会动态代理,就要被淘汰了

👏作者简介:大家好,我是爱敲代码的小黄,独角兽企业的Java开发工程师,CSDN博客专家,阿里云专家博主📕系列专栏:Java设计模式、数据结构和算法、Kafka从入门到成神、Kafka从成神到升仙…

BingGPT 国内中转

BingGPT 国内中转 本项目的github地址 本项目最上层是提供一个使用BingGPT的web接口,仅供学习,如有侵权请联系作者。 预先准备: 一个可以访问bingGPT的外网服务器(可在tencent cloud 选购)一个在已经注册new_bing_list的账号 …