呜啦!日常碎碎念,偶尔掉落优质前端博文推荐、学习资源等
网页:https://tg.cosine.ren
本频道的搜索Bot 来辣 👉 @cosSearchBot
私聊直接发消息就可以搜索啦~
🔖tags
#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #手工 #书摘 #阮一峰的科技周刊 #新动态
图频:Cosine 🎨 Gallery @CosineGallery
猫片: @cosine_cat
网页:https://tg.cosine.ren
本频道的搜索Bot 来辣 👉 @cosSearchBot
私聊直接发消息就可以搜索啦~
🔖tags
#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #手工 #书摘 #阮一峰的科技周刊 #新动态
图频:Cosine 🎨 Gallery @CosineGallery
猫片: @cosine_cat
Cursor 能用 claude 3.7 了,非常好非常好。 之前一直觉得 3.5 很好用(
https://fixupx.com/cursor_ai/status/1894093436896129425
Sonnet-3.7 is available in Cursor!
We've been very impressed by its coding ability, especially on real-world agentic tasks. It appears to be the new state of the art.
#优质博文 #前端 #动画 #motion #css #动画 #交互设计
不得不说真棒啊,给了我好多灵感和小点子~能把自己做的什么讲的明明白白好厉害。
A Million Little Secrets 一百万个小秘密
AI 摘要:本文详细拆解了Josh W. Comeau为其动画课程设计的登录页面的技术实现。该页面看似简洁,但包含 14,000+ 行代码和 200+ 文件,通过多个交互工具(如“Chaos Toolbar”)和动态效果(如粒子、爆炸、魔法棒变换)展示前端动画技术。
核心内容包括:
1. SVG动画 :通过分组(
2. 粒子系统 :利用极坐标系生成随机方向粒子,结合 CSS 三角函数与动画延迟实现自然效果。
3. 雪碧图优化 :将 22 个 3D 形状合并为单图,通过
4. 音效设计 :使用多采样、按键反馈音效与自定义录音增强交互真实感,并开源 React Hook 库
5. Canvas 烟花:基于极坐标和物理模拟实现庆祝效果,强调“新颖性”对动画趣味性的重要性。
此外,作者分享了开发中的取舍(如舍弃糖果主题素材)、性能优化策略(如 5 秒加载超时控制)及未来计划(如
via Josh W Comeau
不得不说真棒啊,给了我好多灵感和小点子~能把自己做的什么讲的明明白白好厉害。
A Million Little Secrets 一百万个小秘密
AI 摘要:本文详细拆解了Josh W. Comeau为其动画课程设计的登录页面的技术实现。该页面看似简洁,但包含 14,000+ 行代码和 200+ 文件,通过多个交互工具(如“Chaos Toolbar”)和动态效果(如粒子、爆炸、魔法棒变换)展示前端动画技术。
核心内容包括:
1. SVG动画 :通过分组(
<g>
标签)与 transform-origin
控制图标动画(如炸弹旋转、橡皮擦路径分离)。 2. 粒子系统 :利用极坐标系生成随机方向粒子,结合 CSS 三角函数与动画延迟实现自然效果。
3. 雪碧图优化 :将 22 个 3D 形状合并为单图,通过
object-position
定位,减少加载闪烁与带宽消耗。 4. 音效设计 :使用多采样、按键反馈音效与自定义录音增强交互真实感,并开源 React Hook 库
use-sound
。 5. Canvas 烟花:基于极坐标和物理模拟实现庆祝效果,强调“新颖性”对动画趣味性的重要性。
此外,作者分享了开发中的取舍(如舍弃糖果主题素材)、性能优化策略(如 5 秒加载超时控制)及未来计划(如
prefers-reduced-data
适配)。 via Josh W Comeau
#前端 #优质博文 #javascript #rust #wasm
Rust 正在吞噬 JavaScript
https://leerob.com/n/rust
via Lee Robinson
Rust 正在吞噬 JavaScript
https://leerob.com/n/rust
AI 摘要:本文详细探讨了Rust语言如何凭借其速度、内存安全和高性能成为替代传统JavaScript工具(如Babel、Terser、Prettier等)的新选择。文章首先介绍了Rust独特的内存管理机制——内存所有权,通过编译时检查消除运行时错误,进而在底层系统开发中表现优异。随后讨论了Rust在业界和开源项目中的应用,如SWC、Deno、esbuild、Rome,以及NAPI与WebAssembly的结合,为前端工具性能带来了质的飞跃。同时,文中也指出了Rust学习曲线陡峭以及生态尚未完全成熟的现状,探讨了未来如何平衡易用性和极致性能,从而推动JavaScript工具链向更高效、更统一的方向演进。最后文章更新了2023年后涌现的新项目,展望Rust将持续主导前端构建工具的发展。
via Lee Robinson
#优质博文 #新动态 #新标准 #前端 #typescript #工程化 #正则
TC39 将 3 个提案推进到第4阶段:Regexp Escaping,Float16Array 和 Redeclarable Global Eval Vars
https://socket.dev/blog/tc39-advances-3-proposals-to-stage-4-regexp-escaping-float16array-and-redeclarable-global-eval
TC39 将 3 个提案推进到第4阶段:Regexp Escaping,Float16Array 和 Redeclarable Global Eval Vars
https://socket.dev/blog/tc39-advances-3-proposals-to-stage-4-regexp-escaping-float16array-and-redeclarable-global-eval
AI 摘要:本文详细报道了 TC39 第 106 次会议期间,多达九项 JavaScript 提案在不同阶段取得进展,其中三个关键提案—— RegExp Escaping、Float16Array 和 Redeclarable Global Eval Vars 已经晋升到 Stage 4,即将成为正式的 ECMAScript 标准。文章不仅介绍了这些提案的具体内容和优势,例如为正则表达式提供内置转义功能,为数值处理引入更加节省内存的16位浮点数组,还讨论了其它提案如 Error.captureStackTrace 和 Error.prototype.stack 标准化、import defer 模块延迟加载、以及Math.clamp 函数的添加。这些改变旨在提升语言的安全性、跨平台一致性和性能表现。文末还列举了 Decimal & Measure、装饰器、Records & Tuples 等其他讨论中的话题,预示了 JavaScript 未来可能的进一步扩展和优化。