蒲公英 · JELLY技术周刊 Vol.18 关于 React 那些设计

本文主要是介绍蒲公英 · JELLY技术周刊 Vol.18 关于 React 那些设计,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

HEADER

蒲公英 · JELLY技术周刊 Vol.18

自 2011 年,Facebook 第一次在 News Feed 上采用了 React 框架,十年来 React 生态中很多好用的功能和工具在诸多设计思想和哲学的引导下被开发完成,印象最深的的设计是哪些?Fiber、Hooks 还是 Suspense?或者是一些 React 生态中的工具,比如 React Europe 2020 上刚刚分享的 Recoil?从 Class 走向 Function,Algebraic Effects 又有多少了解呢?

登高远眺

天高地迥,觉宇宙之无穷

基础技术

深色模式适配指南

自从 iOS13 自带支持深色模式(dark mode)以来,就一直为大家所关注,仿佛支持深色模式已经成为现代移动应用和网站的一个潮流,这不得不证明 iOS 的影响力之强大。本文就 Web、APP、Flutter 如何来实现深色模式适配,进行了深入地剖析。其中 Web 适配最终采用的是 CSS 变量+降级的方案,而 iOS、Android 原生以及 Flutter 都有各自系统提供的 API 能够比较容易地实现深色模式适配。

前端框架

超简单 Algebraic Effects 入门 -- React Team 出品

React team 的 Sebastian(曾提出 Hooks 与 Suspense 等特性) 常常谈到 React 的某些特性其实是以 Algebraic Effects 作为心智模型,这让他的同事 Dan (Redux 作者)非常好奇。一番探索之后 Dan 发现这个从函数式编程领域而来的概念并没有一些学术论文上写的那么复杂,因此透过本文向不了解 Algebraic Effects 的开发者进行科普,并讲述了它与一些 React 特性之间的抽象联系。

Recoil - 面向 React 设计的状态管理库

在 5 月的 React Europe 2020 上,Dave McCabe 为我们分享了 FaceBook 推出的状态管理工具 Recoil。在状态管理工具琳琅满目的今日,为什么 React 官方要躬身入局?Recoil 的诞生是为了解决什么问题?Recoil 又是如何兼容 React 最新的特性呢?详情请看视频回顾。

深入解析 React Fiber 架构及源码

在React框架中,总是有一个用于保持状态的内部实例树(internal instances)(组件,DOM节点等),与之相对的是跟具体平台有关的public instance,也被称为Host instance 。从React 16开始,React推出了该内部实例树的新实现以及负责操作树的算法,被称为Fiber,它能够将任务分片,划分优先级,同时能够实现类似于操作系统中对线程的抢占式调度,功能非常强大。有兴趣的小伙伴可以通过这篇文章进行深入的了解~

设计哲学

除了 Todo App 之外,我们如何才能获得实践技术的新点子?

学习新技术的时候,你会拿什么项目来练手呢?大部分人都会选择写一个 Todo App(提醒事项程序) 吧。作为过来人,GaneshMani 认为,Todo App、聊天室等简单的小项目固然可以让初学者熟悉语言、框架的运作,但对于职业生涯,甚至是激烈的面试竞争来说,都是远远不够的。如何想到一个更合适、更有实践意义的项目?这篇文章手把手进行了教学。

工具推介

Postwoman - 一个开源、免费、快速、漂亮的女邮差?

Postman(邮差)你肯定听说过,那 Postwoman(女邮差) 呢?不满足于 Postman 的收费,又受不了 cURL 等工具的繁琐用法,Liyas Thomas 决定用 node + Vue 自己造一个轮子,这便是 Postwoman 的由来。Postwoman 是一款开源的请求构造器,支持调试 Restful 接口,WebSocket、GraphQL 等也不在话下,用法与 Postman 没有太大区别,最重要的是免费,永久的免费。

沧海拾遗

沧海拾遗,积跬步以至千里

使用 react-docgen 自动生成组件文档

写文档是不可能的,但是开发却也离不开文档,那么一个自动化文档就是必不可少的!如果你也用 React 完成开发工作,相信 react-docgen 会给日常的开发工作带来极大的便利,统一文档格式,节省时间做更多有意义的事情~~

手写 webpack 打包一个 react 单页面应用

打包是前端工程化中不变的问题,如何高效高质量的完成它,在开发和发布过程中,都可以节省很多成本。但是你真的了解打包的原理么?这次我们就从一个简单的 react 单页面应用着手,来详细讲讲 webpack 到底干了啥。

「蒲公英」期刊,每周更新,我们专注于挖掘「基础技术工程化跨端框架技术图形编程服务端开发桌面开发人工智能设计哲学前端框架」等多个大方向的业界热点,并加以专业的解读;不仅如此,我们还会推介精选凹凸技术文章,向大家呈现团队内的研究技术方向。

抬头仰望,蒲公英的种子会生根发芽,如夏花绚烂;格物致知,我们登高远眺、沧海拾遗,以求积硅步而至千里。

蒲公英 · JELLY技术周刊贡献指南

欢迎关注凹凸实验室博客:aotu.io

或者关注凹凸实验室公众号(AOTULabs),不定时推送文章:

欢迎关注凹凸实验室公众号

这篇关于蒲公英 · JELLY技术周刊 Vol.18 关于 React 那些设计的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/394479

相关文章

CSS Padding 和 Margin 区别全解析

《CSSPadding和Margin区别全解析》CSS中的padding和margin是两个非常基础且重要的属性,它们用于控制元素周围的空白区域,本文将详细介绍padding和... 目录css Padding 和 Margin 全解析1. Padding: 内边距2. Margin: 外边距3. Padd

CSS will-change 属性示例详解

《CSSwill-change属性示例详解》will-change是一个CSS属性,用于告诉浏览器某个元素在未来可能会发生哪些变化,本文给大家介绍CSSwill-change属性详解,感... will-change 是一个 css 属性,用于告诉浏览器某个元素在未来可能会发生哪些变化。这可以帮助浏览器优化

CSS去除a标签的下划线的几种方法

《CSS去除a标签的下划线的几种方法》本文给大家分享在CSS中,去除a标签(超链接)的下划线的几种方法,本文给大家介绍的非常详细,感兴趣的朋友一起看看吧... 在 css 中,去除a标签(超链接)的下划线主要有以下几种方法:使用text-decoration属性通用选择器设置:使用a标签选择器,将tex

前端高级CSS用法示例详解

《前端高级CSS用法示例详解》在前端开发中,CSS(层叠样式表)不仅是用来控制网页的外观和布局,更是实现复杂交互和动态效果的关键技术之一,随着前端技术的不断发展,CSS的用法也日益丰富和高级,本文将深... 前端高级css用法在前端开发中,CSS(层叠样式表)不仅是用来控制网页的外观和布局,更是实现复杂交

Python将博客内容html导出为Markdown格式

《Python将博客内容html导出为Markdown格式》Python将博客内容html导出为Markdown格式,通过博客url地址抓取文章,分析并提取出文章标题和内容,将内容构建成html,再转... 目录一、为什么要搞?二、准备如何搞?三、说搞咱就搞!抓取文章提取内容构建html转存markdown

在React中引入Tailwind CSS的完整指南

《在React中引入TailwindCSS的完整指南》在现代前端开发中,使用UI库可以显著提高开发效率,TailwindCSS是一个功能类优先的CSS框架,本文将详细介绍如何在Reac... 目录前言一、Tailwind css 简介二、创建 React 项目使用 Create React App 创建项目

vue使用docxtemplater导出word

《vue使用docxtemplater导出word》docxtemplater是一种邮件合并工具,以编程方式使用并处理条件、循环,并且可以扩展以插入任何内容,下面我们来看看如何使用docxtempl... 目录docxtemplatervue使用docxtemplater导出word安装常用语法 封装导出方

SpringBoot3实现Gzip压缩优化的技术指南

《SpringBoot3实现Gzip压缩优化的技术指南》随着Web应用的用户量和数据量增加,网络带宽和页面加载速度逐渐成为瓶颈,为了减少数据传输量,提高用户体验,我们可以使用Gzip压缩HTTP响应,... 目录1、简述2、配置2.1 添加依赖2.2 配置 Gzip 压缩3、服务端应用4、前端应用4.1 N

Java利用JSONPath操作JSON数据的技术指南

《Java利用JSONPath操作JSON数据的技术指南》JSONPath是一种强大的工具,用于查询和操作JSON数据,类似于SQL的语法,它为处理复杂的JSON数据结构提供了简单且高效... 目录1、简述2、什么是 jsONPath?3、Java 示例3.1 基本查询3.2 过滤查询3.3 递归搜索3.4

Python中随机休眠技术原理与应用详解

《Python中随机休眠技术原理与应用详解》在编程中,让程序暂停执行特定时间是常见需求,当需要引入不确定性时,随机休眠就成为关键技巧,下面我们就来看看Python中随机休眠技术的具体实现与应用吧... 目录引言一、实现原理与基础方法1.1 核心函数解析1.2 基础实现模板1.3 整数版实现二、典型应用场景2