20240419 前端开发日报

手撸一个星系，送给心爱的姑娘（Three.js Shader 粒子系统实现）；前端 er 如何玩转音视频流-WebRTC 技术介绍；Flutter – 热更新 Shorebird 1.0 正式版来了 ；Flutter 之 HTTP3/QUIC 和 Cronet 你了解过吗？；2024 抖音欢笑中国年(五)：Wasm、WebGL 在互动技术中的创新应用；CSS如何优雅的实现卡片多行排列布局？；Flutter 像素编辑器#03 | 像素图层；利用IDEA/WebStorm/pycharm的【多光标输入】提高开发效率

1. 手撸一个星系，送给心爱的姑娘（Three.js Shader 粒子系统实现）

   用 Three.js Shader 粒子系统手撸一个超级漂亮的星系效果！学习如何在球体和圆盘上设置顶点、如何插值颜色、让粒子运动起来等等！

2. 前端 er 如何玩转音视频流-WebRTC 技术介绍

   前端 er 如何玩转音视频流-WebRTC 技术介绍 最近做了一个 AI 问答的项目，需要获取用户的摄像头，录像录音，实时语音转文字等等功能，记录一下踩过的坑。以及目前的最佳实现。

3. Flutter – 热更新 Shorebird 1.0 正式版来了

   等了这么久，就在 4月9号 这一天，Shorebird 的 1.0 正式版终于来了！本次最关心的还是对 iOS 的热更新支持得如何了，因为在之前的版本中，iOS 的性能表现简直差到无法使用~

4. Flutter 之 HTTP3/QUIC 和 Cronet 你了解过吗？

   虽然 HTTP3/QUIC 和 cronet 跟 Flutter 没太大关系，只是最近在整理 Flutter 相关资料时发现还挺多人不了解，就放到一起聊聊。 前言 其实为什么会有 HTTP3/QUIC

5. 2024 抖音欢笑中国年(五)：Wasm、WebGL 在互动技术中的创新应用

   本文包括：高性能 Wasm + WebGL 渲染引擎、Lottie 动画 WebGL 渲染、WebGL 帧差序列帧等。

6. CSS如何优雅的实现卡片多行排列布局？

   在前端开发中，我们经常遇见这样的开发需求，实现多行排布的卡片，这些卡片宽度一般是固定的， 并且在不同大小的屏幕宽度下自动换行。

7. Flutter 像素编辑器#03 | 像素图层

8. 利用IDEA/WebStorm/pycharm的【多光标输入】提高开发效率

9. 面试官：pnpm 那么流行，知道它的源码架构实现吗？

   pnpm 作为一个优秀的包管理工具，在如今的前端生态中呈持续发展的趋势，这篇文章就会给大家带来 pnpm 的源码结构探究！

10. vite 引入本地图片遇到的坑

11. 每个开发人员都应该知道的13个Nodejs库

12. 聊聊 CSS 的 ::marker

13. 面试官：说说包管理工具的发展以及 pnpm 依赖治理的最佳实践

14. 【AI】coze打造前端知识助手Bot初体验

15. 一周涨 15k Star 的开源项目「GitHub 热点速览」

16. 【Flutter】Form表单，狗都不用到真香 & 如何自定义Form表单子控件

17. 【Flutter】Form表单，狗都不用到真香 & 如何自定义Form表单子控件

    Form表单的使用，封装，与自定义 前言 不管是一个应用还是一个网页，一个表单提交都是少不了，登录、注册、完善消息等常用的功能都离不开表单的提交。 在之前我们开发 Android 应用都是直接堆布局就

18. 【Flutter】Form表单，狗都不用到真香 & 如何自定义Form表单子控件

19. 蕴藏在JS里的爱意，通过爱情故事轻松学会JS基础

20. 写了个webpack插件，1722行代码，无感升级到vue3

21. 【问题解决】如何在 Vue 切换子组件时优雅地进行 Form 表单校验

22. 【问题解决】如何在 Vue 切换子组件时优雅地进行 Form 表单校验

23. 【问题解决】如何在 Vue 切换子组件时优雅地进行 Form 表单校验

    在项目中使用 Vue <component> 遇到了一些挑战，通过点击 <el-aside> 标签切换子组件时，并不能自动触发表单校验，这就需要在父组件中集成对子组件表单的校验逻辑。