React本周热点 #90: JSX,Tinybase,Dioxus,Owl,useWorkerizedReducer,Perf,TS,CSS

513 阅读6分钟

原文地址:www.getrevue.co/profile/thi…

React

Good advice on JSX conditionals(JSX条件写法的好建议)

我们喜欢 React,因为它还是 JavaScript,我们不需要学习另一种模板语言。但是让我们管理它并不总是那么容易,并且有一些陷阱需要避免😅这篇文章给出了一个很好的描述。

笔者备注:通过简单的图文,让人们很容易理解正确的写法和需要注意的坑。

useWorkerizedReducer

Surma (Google) 介绍了一个库使用 Service Worker 来创建 React reducer(可能是异步的)的库。由于使用 Immer JS 和使用 post Message 传输补丁,通信效率很高。 浏览器兼容性很好,只有 Firefox 需要 polyfill。现在让我们为这个🤷‍♂️找到一个好的用例,有人自荐么?

An Inconsistent Truth: Next.js and Type Safety(不一致的事实:Next.js 和类型安全)

关于Next.js中当前end-2-end类型限制的有趣想法,重点放在getServerSideProps和page props。要么有太多的手动样板文件(出错的风险),要么是类型帮助器InferGetServerSidePropsType可能会产生出人意料的不安全结果。唤起所有框架期待已久的 TypeScript 功能:类型模块导出的能力。绍其他解决方案,如 Blitz、服务器组件或tRPC。最后一个看起来非常有趣(另请参阅使用它的zart样板)。

TinyBase

新的结构化数据的反应式存储(在表中,如SQL或Normalizr),带有 React 集成包,包括用于高效、细粒度订阅的诸如useCell之类的hooks。体积小,但很有特色:索引、关系、撤消/重做……

💸赞助商

Stream:用于 React 和 React-Native 的强大聊天和提要

Stream 是企业级APISDK的制造商,可帮助产品和工程团队大规模解决两个常见问题:应用内聊天社交活动反馈

借助 Stream,开发人员可以将任何类型的消息传递或各种反馈集成到他们的应用程序中,所需时间只是从头开始构建这些功能所需时间的一小部分。Stream Chat 使开发人员可以轻松地将丰富的实时消息传递到他们的应用程序中。

Stream 为ReactReact-Native、Flutter、Android、Angular、Compose、Unreal 和 iOS等流行框架提供强大的客户端 SDK 。它还支持Expo 管理的工作流程

使用Maker Account为您的启动或副项目完全免费解锁企业级特性、功能和 UI 组件。

React Native

React-Native-Owl:React-Native 的视觉回归测试

这个新的解决方案以原生方式运行您的 React-Native 屏幕,截取屏幕截图,并将它们与./owl中以前存储的屏幕截图进行比较,以生成报告。所有这些都与 Jest 很好地集成在一起(如快照)。

很高兴看到 React-Native 的可视化回归测试进展:这非常有用,与 web 相比,React-Native 已经落后了一点。另请参阅Storybook React-Native-Web允许使用Chromatic执行类似的操作,但但需要进行Web转换。

附加功能:

伙伴

  • 开始 React Native:与 William Candillon 一起学习有关手势和动画的一切
  • React-Native Weekly:保持最新的 React-Native 核心更新
  • TypeScript Weekly:每周最好的 TypeScript 链接,应该在你的邮箱里面。
  • ES.next 新闻:了解最新的 JavaScript 和跨平台工具
  • Tailwind Weekly : 所有关于Tailwind CSS的东西,每周六新一期
  • G2i:经过预先审查的远程 React 和 React-Native 开发人员,您可以按合同或完全信任本地开发人员
  • Infinite Red:美国 React-Native 专家让您的想法成为现实
  • 软件大厦:React Native 的共同创造者,众多科技公司的技术核心

其它

Parcel CSS

用Rust编写的一种新的解析器、编译器、压缩器,复用Firefox的 rust-cssparser。在速度和输出规模方面优于竞争对手(甚至是esbuild)。集成在 Parcel 中,但也可以在 Rust 或 JavaScript(Webpack?)甚至Deno 或 Web(WASM)中独立使用

Dioxus

新的 Rust 框架灵感主要来自于 React(钩子、VDOM、RSX ……),强类型、高性能、跨平台(Web、移动、桌面、SSR)。旨在易于被 React/TypeScript 开发人员采用。

我看了一点跨平台支持,但我不确定它是如何工作的。它说原生性能,但似乎在桌面和移动设备上使用Tauri,afaik 使用 WebViews?🤔

拓展阅读: