奇舞精选

《奇舞精选》是由奇舞团维护的前端技术公众号。除周五外,每天向大家推荐一篇前端相关技术文章,每周五向大家推送汇总周刊内容。

一种适合H5屏幕适配方案
我们需要设置一个根元素的基准值,这个基准值通常根据视口宽度进行计算。可以在项目的 CSS 文件中,通过媒体查询动态调整根元素的 `font-size`。
如何使用 Github Action 管理 Issue
很多小伙伴打开 github 上的仓库都只使用Code查看代码,或者只是把 github 当成一个代码仓库,但是 github 还提供了很多好用的功能。其中,GitHub Action就是一个很好用的功能,本文将通过几个管理Issue的示例带大家了解GitHub Action。
Vue 项目 SEO 优化的关键
最近在一个 Vue 项目中,发现了许多在开发前、中、后期需要特别注意的细节,以确保性能和 SEO 的最佳结合。本文将聊聊 Vue 项目要做 SEO 优化方向侧的一些相关内容.
一个易用的消息订阅发布系统-Pubsub.js
本文介绍的 pubsub.js 就是一个非常实用的消息订阅发布库。它具有使用简单、性能高效、支持多平台等优点,可以很好地满足各种需求。
Go 语言入门
Go 语言是诞生于 2009 年的编程语言,发展到今天已经有过去了 15 年。目前 Go 语言在国内外的社区都非常热门,很多著名的开源框架,例如:Docker、k8s、 Prometheus 等都使用 Go 语言开发,越来越多的公司也将 Go 作为技术选型之一。
Redux Toolkit
阅读本文章前,需要先了解下 redux 的基本概念与用法,Redux Toolkit 是建立在 Redux 基础之上的工具包,因此需要对 Redux 的基本概念有一定的了解,包括 Action、Reducer、Store、Middleware 等。理解 Redux 的工作原理和数据流程有助于更好地理解和使用 Redux Toolkit。
[译]装饰器的10年历史
"装饰器是一种结构设计模式,通过将对象置于包含行为的特殊包装器对象中,可以将新的行为附加到对象上"。© https://refactoring.guru/design-patterns/decorator
[译]JavaScript中Base64编码字符串的细节
Base64编码和解码是一种常见的将二进制内容转换为适合Web的文本的形式。它通常用于data URLs,比如内嵌图片。当你在JavaScript中对字符串应用base64编码和解码时会发生什么?这篇文章探讨了这些细节和需要避免的常见陷阱。
[译]CSS Animations 与 CSS Transitions
在 CSS 中有两种设置动画的方式即 CSS animations 和 CSS transitions。它们看上去有些相似,但了解后会发现他们有很大不同。接下来,我们将探讨两者之间的异同,以及什么情况下更适合选择哪一种。
React 中条件渲染的 N 种方法
条件渲染在React开发中非常重要的功能,它允许开发人员根据条件控制渲染的内容,在创建动态和交互式用户界面方面发挥着至关重要的作用,本文总结了常用的的条件渲染方法。
一个Level 0富文本编辑器的进化历程
富文本编辑器是我们在生活中常用到的编辑工具,本文将为大家介绍富文本编辑器技术成长的历程,在最后会带大家利用document.execCommand实现一个简单的传统编辑器。
React Router v6 实践
React Router 是 React 应用程序中用于处理路由的标准库。随着版本的不断更新,React Router v6 引入了许多重要的新特性和改进。
逃离 HTML + CSS
当下,构建交互式应用程序的主流技术是 Web 技术,其中包括 HTML、CSS 与 JavaScript。在过去的 10 年,Web 技术生态发生了翻天覆地的变化,包括层出不穷的开发框架,诸如 React、Vue、Svelte,也包括日新月异的前端工程化工具,比如 Webpack、esbuild、Vite 等等。但归根结底,他们都逃不开 HTML、CSS、JavaScript 三剑客的范畴。
深入剖析 Promise.withResolver
本文将着重探讨 ECMAScript 2024 年的新特性之一 -- "Promise.withResolvers"(由 Peter Klecha 提出)。该特性提供了一种直接创建 Promise 的新方法,可替代 new Promise(...)。
三种虚拟列表原理与实现
工作中一直有接触大量数据渲染的业务,使用react-window多之又多,所以对虚拟列表有了些浅显的理解。今天,我们就照着react-window的使用方式来实现三种虚拟列表。
轻量级、可插拔、OOP 式图形编辑器开发引擎
图形编辑器在多个行业中扮演着至关重要的角色,其应用范围广泛且影响深远。以 Figma 为典范的 Web 图形设计工具,为人们提供了一个自由发挥创造力的平台,随着 Web 平台的发展壮大,技术如 WebGL 和 WebGPU 的涌现与成熟,为传统的 OpenGL 图形编辑系统迁移到 Web 环境带来了新的可能性,极大地拓展了创新的边界。
了解前端新框架-nue.js
前端开发者 Tero Piirajinen 推出了一个名为 Nue.js 的极简化前端开发工具,并迅速引发社区讨论。Piirajinen 在 Hacker News 上表示,它是 React、Vue、Next.js、Vite、Svelte 和 Astro 的替代品。
更轻巧的状态管理工具——Hookstate
作为 React 开发人员,管理中型应用程序的状态可能很困难。在开发小型应用程序时,将状态从一个组件传递到另一个组件相对简单。当应用程序的规模发生变化时,就会变得不方便,因为你需要无层级关系组件状态的互相访问支持。
前端“量子纠缠”:multipleWindow3dScene 来了
在量子力学里,当几个粒子在彼此相互作用后,由于各个粒子所拥有的特性已综合成为整体性质,无法单独描述各个粒子的性质,只能描述整体系统的性质,则称这现象为量子缠结或量子纠缠。量子纠缠是一种奇怪的量子力学现象,处于纠缠态的两个量子不论相距多远都存在一种关联,其中一个量子状态发生改变,另一个的状态会瞬时发生相应改变。
JavaScript中的设计模式
JavaScript设计模式是编程世界的智慧结晶,提供了解决常见问题的优秀方案。无论你是初学者还是经验丰富的开发者,掌握这些模式都能让你的代码更清晰、更灵活。本文将为你介绍一些常见的设计模式,帮助你提高代码质量,构建更可维护的应用。让我们一起深入了解这些设计模式的精妙之处吧!
不同打包工具下的环境变量配置方式对比
在现代的JavaScript应用程序开发中,环境变量的配置是至关重要的。不同的应用场景和部署环境可能需要不同的配置,例如开发、测试和生产环境。最常见的需求是根据不同的环境,配置如是否开启sourceMap、API请求地址的切换、是否压缩代码等逻辑。本文主要介绍利用不同的工具:Webpack、Vite、Rollup打包项目的环境变量的配置方式。
小学生都开始学 Python 了!
Python 被认为是人工智能、机器学习的首选语言。因为人工智能要求机器能自主学习成长,机器要会学习,首先要积累大量的数据,然后运用机器学习算法如线性回归、决策树、神经网络等,让机器能从大量的数据中自主实现学习。Python 简洁易用的特点,以及在数据处理方面的强悍能力,使得目前市面上大部分人工智能的代码,都由 Python 来实现。
大模型RAG入门及实践
在大语言模型(LLM)飞速发展的今天,LLMs 正不断地充实和改进我们周边的各种工具和应用。如果说现在基于 LLM 最火热的应用技术是什么,检索增强生成(RAG,Retrieval Augmented Generation)技术必占据重要的一席。RAG 最初是为了解决 LLM 的各类问题的产生的,但后面大家发现在现阶段的很多企业痛点上,使用RAG好像是更好的解决方案。在介绍 RAG 之前,我们先来看一下现在LLM存在的问题。
使用React Context的一些优化建议
Context 提供了一个无需为每层组件手动添加 props,就能在组件树间进行数据传递的方法。
AI模特换装的前端实现
随着AI的火热发展,涌现了一些AI模特换装的前端工具(比如weshop网站),他们是怎么实现的呢?使用了什么技术呢?下文我们就来探索一下其实现原理。
Web 端 RTL 适配实践
在业务全球化的进程中,我们会面对产品本地化的需求。在中东地区,许多国家使用阿拉伯语、希伯来语等语言,其书写和阅读习惯是从右向左(简称 RTL),与我们日常使用的中、英文环境中的从左向右(简称 LTR)阅读习惯相反。为了确保我们的产品在 RTL 语言用户中依然能够提供良好的体验,需要进行 RTL 适配。
几个好玩好用的AI站点
ai能力在去年一年飞速增长,各种AI产品如雨后春笋般冒出来,在各种垂直领域上似乎都有AI的身影出现,今天就总结几款好玩的场景,看大家工作生活中是否会用到。
探究Base64在前端的原理和应用
Base64在前端开发中的普遍应用。本文将探讨Base64编码的原理以及在前端项目中应用的实际应用。
二十分钟掌握React核心理念,老鸟快速入门指南
这是一份适合有着前端开发经验,并习惯使用现代前端框架,却还没深入使用过 React 的老鸟快速入门指南,如果你还没有接触过前端框架,那建议直接在官方文档仔细从头看起。
Vue项目构建优化
在开发大型前端项目时,往往是一个需求对应一个分支,当完成需求后,就需要将代码打包、部署。代码通常需要部署到多个环境中,这些环境包括:日常环境、测试环境、回归环境和生产环境。回归环境用于在发布前进行测试,生产环境是用户访问的版本。随着时间的推移,项目中会不断引入许多新的依赖(如第三方库、插件等)和图片资源,代码数量也会逐渐增多,从而导致构建项目更加耗时,这也意味着部署项目需要消耗更长的时间。