呜啦!日常碎碎念,偶尔掉落优质前端博文推荐、学习资源等
网页:https://tg.cosine.ren
本频道的搜索Bot 来辣 👉 @cosSearchBot
私聊直接发消息就可以搜索啦~
🔖tags
#优质博文 #资源推荐 #博客更新 #碎碎念 #项目更新 #手工 #书摘 #阮一峰的科技周刊 #新动态

图频:Cosine 🎨 Gallery @CosineGallery
猫片: @cosine_cat
#技术科普 #AI #LLM #course #开源
karminski/one-small-step

AI 摘要:karminski/one-small-step 是一个技术科普教程项目,旨在以简洁易懂的方式解释有趣且前沿的技术概念和原理,每篇文章力求在 5 分钟内阅读完毕。项目内容涵盖人工智能(AI)、数学、系统和硬件等多个领域,并计划保持每周不低于 3 篇的更新速度,旨在帮助读者快速掌握复杂的技术知识。


author karminski-牙医 GitHub - karminski/one-small-step: 这是一个简单的技术科普教程项目,主要聚焦于解释一些有趣的,前沿的技术概念和原理。每篇文章都力求在 5 分钟内阅读完成。
#碎碎念
今天去少数派总部疯狂星期六了,原来少数派总部在深圳~
了解了很多少数派的故事,大伙聊得很开心,等会回去了再细说~
#优质博文 #CSS #chrome #新特性
New in Chrome 139

AI 摘要:Chrome 139 带来了多项面向开发者的重要新功能,包括本地 Web Speech API(语音识别)、CSS corner shaping(角样式)、CSS custom functions(自定义函数)等,进一步提升了 Web 应用的性能、安全性和界面设计能力。本文亮点简要梳理了此次版本中的主要更新和对开发者生态的影响。

1. 本地 Web 语音识别(Web Speech API)
• Web Speech API 现支持在本地进行语音识别,无需将音频数据上传至第三方服务,提升了隐私和安全性。
• 开发者可以检测本地语音识别能力、提示用户安装相关资源,并按需选择本地或云端识别方案。
• 有助于为多语言和对隐私敏感的场景提供更优支持。

2. CSS 角样式(CSS corner shaping)
• 新增 CSS 属性允许开发者自定义角的形状与曲度,超越传统的 border-radius。
• 支持创建如 squircles(圆角矩形)、notches(凹口)、scoops(挖口)等更为丰富的视觉样式,并可实现动画切换。
• 拓宽了 Web 设计在 UI 形状表现上的空间。

3. CSS 自定义函数(CSS custom functions)
• 引入 @function 规则,使开发者可像自定义属性一样定义函数,实现基于参数、条件的动态样式生成。
• 支持函数内调用变量,显著增强了 CSS 的可复用性与逻辑性,推动 CSS 向编程化发展。
• 这一特性属于 CSS Custom Functions and Mixins(函数与混入)规范的一部分。

4. 其他新特性与改进
• web app manifest 新增 scope_extensions 字段,方便多子域、多顶级域的站点整合作为单一应用呈现。
• Chrome 现在识别 WHATWG mimesniff 规范中定义的所有有效 JSON MIME 类型,提升兼容性。
• request-close 调用已集成至声明式 invoker commands API,优化 JavaScript 的事件处理模型。


author Rachel Andrew New in Chrome 139  |  Blog  |  Chrome for Developers
#优质博文 #CSS #grid #容器查询
Get the number of auto-fit/auto-fill columns in CSS

AI 摘要:这篇博文深入探讨如何在纯 CSS 中获取 grid 布局中 auto-fit/auto-fill 自动列的列数,从而实现如高亮首/末列、斑马纹、响应式非矩形网格等复杂交互,无需任何 JavaScript 或媒体查询(breakpoints)。作者提出了通过 container query 单位、CSS 变量和数学函数自动计算列数的方法,并针对不同浏览器支持和 bug(尤其是 Firefox)提出了解决方案,使技巧能够跨浏览器使用。


author Ana Tudor
Get the number of auto-fit/auto-fill columns in CSS
#优质博文 #CSS #动画 #前端 #新特性
Infinite Marquee Animation using Modern CSS

AI 摘要:本文介绍了如何用现代 CSS 新特性(如 shape(), sibling-count(), sibling-index() 等)实现一个无限循环的简洁 Marquee(走马灯)动画,无需 JavaScript,并能自动适配任意数量、任意宽度的图片或元素。作者详细讲解了这一方案相比传统方法(如 <marquee> 或元素克隆)在性能、可维护性和响应式设计上的优势,并提供了完整、紧凑的 CSS 代码实例。相比以往需要繁琐计算或操作 DOM,此方法仅需 10 行 CSS 即可实现高效且灵活的无限轮播动画,同时分析了 shape() 函数的基本用法及其带来的灵活性。


author Temani Afif Infinite Marquee Animation using Modern CSS
#碎碎念
今天想起来我为什么不查查广州到深圳有没有大巴,然后发现只要 26 就能从我现在附近的地铁站到我家附近的地铁站,以前都是打车一趟 160 多还收 30 多跨城费,高铁的话倒是 70 多但是高铁站离我家还得地铁一个半小时。
麻了,感觉血亏一个亿,时间上甚至还跟打车差不多
#优质博文 #CSS #前端 #主题化 #color #设计
Thinking Deeply About Theming and Color Naming | CSS-Tricks

AI 摘要:本文深入探讨了前端开发中主题和颜色命名的设计实践及困惑,从流行 CSS 框架的色板设计现状、手动与程序化生成色板的方法谈起,剖析了颜色变量定义中的“语义命名”混乱,并提出了更灵活与语义化兼容的命名及管理方式,以支持更加多变且有辨识度的 Web 设计系统。


author Zell Liew Thinking Deeply About Theming and Color Naming | CSS-Tricks
#AI #新动态
想了想还是发一下,毕竟 OpenAI 终于发了呢
https://openai.com/open-models
gpt-oss-120b 激活参数量 5.1B
gpt-oss-20b 激活参数量 3.6B
两个都是 MoE 架构的推理模型.


https://fixupx.com/karminski3/status/1952828063374557618

karminski-牙医 (@karminski3): 就在刚刚 OpenAI 发布了两个开放权重模型! 给大家带来深度解析!

gpt-oss-120b 激活参数量 5.1B
gpt-oss-20b 激活参数量 3.6B

两个都是 MoE 架构的推理模型.

首先, 这两个模型发布的就已经是量化版本了, 他们的 MoE 层直接用 MXFP4 精度训练的! 这意味着暂时没有办法微调这两个模型了 (现有微调框架不支持, 得等等).

然后, 大家肯定知道 OpenAI 搞了各种奇怪的命名, 比如 O3-mini-high, 这个 high 是啥? 现在答案揭晓, OpenAI 的模型是可以配置推理努力程度的. 分为三档, low, medium, high. 当然 high 模式下跑分最高, 相对的思考时间更长.

Agent 功能适配得非常好, 原生针对 function call, 网页浏览, 执行 python 代码, 各种结构化输出进行了优化. 这也能从从跑分上看出来, 使用 tool 后分数均有提升.
Open models by OpenAI
#优质博文 #bundler #工程化 #前端
Bundler Tree Shaking 原理及差异 · web-infra-dev · Discussion #28

AI 摘要:Tree shaking(摇树优化)已成为现代前端打包(bundler)领域的重要优化手段。不同 bundler 工具(如 Webpack、Rollup、esbuild、Turbopack)由于应用场景和关注点不同,实现 tree shaking 的原理与细节也有所差异。文章系统对比了这些工具的 tree shaking 实现,包括分析粒度、副作用(side effects)判定、模块/语句/AST(抽象语法树)层面的优化,以及各自的优势与局限性,并详细剖析了典型案例。对于需要深入理解前端 build 工具原理与优化策略的开发者极具参考价值。


author web-infra-dev ahabhgk Bundler Tree Shaking 原理及差异 · web-infra-dev · Discussion #28
#碎碎念 #优质视频
做一辈子新番吐槽吧泛叔叔,一辈子。
怎么可以这么多活的。
侦探先生,我的7月新番出轨了啊啊啊!【泛式】
大家好我是侦探大家好我是助手大家好我是警长累死我了累死我了累死我了累死我了累死我了求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连求三连七月新番求三连求三连求三连求三连求三连求三连7月新番中期吐槽求三连求三连求三连噼

使用素材:
最近的侦探真没用
章鱼p的原罪
我怎么可能成为你的恋人 不行不行
光死后的夏天
保龄球少女
死灵之子的宇宙恐怖秀
小城日常
琉璃的宝石
沉默魔女的秘密
熏香花朵,凛然绽放
游戏中心的异文化交流
明天美食广场见
新吊带袜天使
渡君的xx即将崩坏
拔作岛
活死喵之夜
坏女孩
怪兽8号 第二季
胆大党 第二季
更衣人偶 第二季
碧蓝之海 第二季
火影忍者
名侦探柯南
银魂

@泛式:
发布视频-动漫杂谈-动漫评论
播放量:45.87万 弹幕:5647 评论:5015
点赞:8.50万 投币:6.44万 收藏:2.14万
发布日期:2025-08-05 11:38:12
时长:0:12:38
#优质博文 #AI #ClaudeCode #VSCode #course
我现在也是这个流程了,不过我是不用 --dangerously-skip-permissions,rm 权限不敢给。

How I use Claude Code (+ my best tips)

AI 摘要:本文作者作为 Claude Code 的深度用户,详细介绍了自己从 Cursor 转向全程使用 Claude Code 的开发体验,总结出一系列高效实用的使用建议。文章覆盖了 Claude Code 的 VS Code 插件启动、终端界面、权限系统、GitHub 集成、大型代码库表现、经济性、队列系统、自定义扩展、可视化界面及团队协作等方面,旨在帮助开发者最大化 Claude Code 在日常工作中的价值与便捷性。


author Steve Sewell How I use Claude Code (+ my best tips)
#优质博文 #AI #RAG #NodeJS #向量检索 #NLP
浅谈 RAG 并基于 NodeJS 实现基础向量检索服务

本文系统介绍了 RAG(Retrieval-Augmented Generation,检索增强生成)模型的基本原理、实际应用场景及其在 NodeJS 环境下的基础实现。作者围绕文本数据的预处理、向量化、向量检索、多路召回、召回重排,以及 LLMs(大语言模型)在流程中的作用展开,详细讲解了如何以轻量级工具搭建一个实用的 RAG 检索服务,并讨论了分片策略、编码方法、检索优化及与开箱即用方案的取舍,为构建定制化AI知识问答系统提供了开源思路和技术参考。

1. RAG 简介与应用场景
• RAG 是结合检索(Retrieval)与生成(Generation)的 AI 架构,能提升对专业领域、高时效性内容的问答、代码生成等场景的回答质量。
• 适用于最新知识获取、特定领域知识补充、提升透明度与可解释性、长尾数据检索、垂直智能问答等实际需求。
• RAG 以内容检索为核心,兼容多种方式(如向量检索、倒排索引、图谱检索等),并与 LLMs 配合工作。

2. 文本向量化流程设计
• 数据预处理包括文本清洗和分片,分片方式有固定长度、overlap 重叠、句段分割、结构分片等,应兼顾语义完整性与检索效率。
• 分片时建议结合元信息(如标题、作者、时间等)以辅助召回与重排。
• 编码方式的演变从 one-hot,TF-IDF,到更先进的 Word2Vec、Transformer-based Embedding。实际项目推荐使用现成高效模型如 all-MiniLM-L6-v2。
• 分片及编码细节优化显著影响检索召回质量和成本。

3. 向量检索与多路召回机制
• 检索的核心是计算 Query 与候选文本的向量相似度,常用余弦相似度(Cosine Similarity),因其只关注方向信息,适合高维稀疏空间。
• 采用 hnswlib-node 快速完成高维向量检索,实际实现还需与实际内容并行存储,便于元数据同步。
• 多路召回建议综合关键词检索、向量召回、图谱召回等互补方式,通过加权、融合、重排序等策略提升检索全面性和精度。

4. 召回重排(Re-Ranking)及其优化
• 初次召回后需对候选结果做重排,提升真正相关内容在前,常见方法如下:
• 传统交叉编码器(如 BERT NSP)精排。
• LLMs 或专门 ReRanker 模型(如 BGE-Reranker)基于上下文深度理解排序。
• 分片元信息和人工打标可进一步增强重排效果,提升系统最终响应准确性和相关性。
• 重排虽可提升体验,但不可避免加大系统复杂度和响应耗时,需按场景权衡。

5. LLMs 在 RAG 流程中的多重角色
• 查询改写:修正拼写、分解多意图、格式化表达、扩展关键词等,显著提高召回精准度。
• 输入优化:用LLMs提升分片、编码智能化水平,以及用于多模态信息抽取、知识图谱构建等。
• 生成增强:将高相关检索片段作为上下文,辅助 LLMs 生成更自然、连贯、有据可溯的答案,并可提升系统的可用性与信任度。
• LLMs 贯穿流程多环节,兼具结构化与半结构化内容的处理与优化能力。

6. 方案总结与工程实践建议
• RAG 作为 AI Infra 基础模块,值得深入学习和灵活定制。开箱服务适用于通用场景,复杂定制或增量优化建议自行实现。
• 流程各节点(分片、编码、检索、重排、生成)都可精调优化,针对需求选择技术方案、服务模型和参数设定。
• RAG 在提升 LLMs 时效性、知识深度、成本控制等方面具备不可替代优势。


author WindRunnerMax
Back to Top