#碎碎念
https://x.com/rxliuli/status/1799668996201144352

前几天刚有人因为浏览器扩展盗取 cookie 损失 100w 刀，结果就有人写了 cookie 管理的扩展，还自荐进了阮一峰的周刊，你猜他想做什么？🤣

你猜猜它还要什么权限？向你访问的所有网页注入脚本的权限。这样的话，只需要一次恶意更新，你使用浏览器访问的所有网站的 cookie 都会泄露，甚至，还可以记录你的帐号密码🥲

看现在的浏览器的插件推荐真的得长点心♥️

#优质博文 #前端 #tailwind #css #最佳实践

研究三天，我找到了 tailwindcss 的正确打开姿势

【这个基本上就是我们现在团队的tailwind 使用方案，确实是很舒服的一套实践~】

AI 摘要：
1. 痛点再审视：冗长的 class 名可通过提取变量来简化，减少代码重复。
2. 无 CSS 方向：虽可用 @apply 聚合样式，但正式项目中不推荐，以避免失去体积优势。
3. 封装思维转变：借鉴 Unocss，将组件属性设计为布尔值，简化传参。

<Button primary sm>Primary SM</Button>

4. 实用工具：
- clsx 合并 class 名。
- twMerge 处理优先级问题。
- cva 管理多值属性。（补充：也可 tailwind-variants，是cva的套件）

const cls = twMerge(clsx('base', {'bg-blue-500': primary, 'bg-red-500': danger}));

5. 智能提示配置：配置编辑器正则表达式，使智能提示在变量和函数中生效。

6. 总结：TailwindCSS 提升开发效率，特别适合快速编写响应式页面。

via 微信公众号 这波能反杀

#碎碎念 #猫
不知道为什么最近每天的开心要溢出屏幕咧，分大伙点🥰🥰🥰🥰

可能是一是因为快要回家了，回家就能见到弟弟妹妹麻麻了嘿嘿嘿嘿。二是养猫太治愈啦，附赠小腊八美照*2

#优质博文 #阮一峰的科技周刊 #前端 #资源推荐 #tools

科技爱好者周刊（第 302 期）：创业虽然好，不敢推荐了

1. <span>元素可以干什么（英文） 📓 <span>是一个表示行内文本的 HTML 网页元素，本文收集了许多案例，你可以用它做各种各样的事情。 #css
2. 如何在 JavaScript 中快速读取文件（英文） 📓 作者列出了 JavaScript 读取文件的5种方法，并且比较了它们的性能差异。 #javascript
3. Sink 🧰 一个基于 Cloudflare 的短链接应用，带有访问统计。（@ccbikai 投稿） #短链接 #自部署
4. PicImpact 🧰 一个 Web 相册程序，基于 Next.js。（@besscroft 投稿） #nextjs
5. Gallery-Portfolio 🧰 一个开源的"瀑布流"照片展示程序，后端可以放在免费的 Cloudflare R2（或其他兼容 AWS S3 的存储），参见 Demo。（@linyuxuanlin 投稿）
6. widget-qrcode 🧰 一个网页二维码的 web component 组件，支持自定义二维码风格模板、前景、背景、logo等。（@mumuy 投稿）
7. cobalt 🧰 一个开源的视频下载网址，支持多个视频网站，包括 B 站、Youtube、instagram 和 Twitter。

【这期的 gallery 相关工具推荐还挺多的】

GitHub

【开源自荐】Sink - 基于 Cloudflare 带访问统计的短链系统 · Issue #4529 · ruanyf/weekly

特性 链接缩短 访问统计 Serverless 部署 自定义 Slug 🪄 AI 生成 Slug 链接有效期 演示 Sink.Cool Site Token: SinkCool 全站分析 链接管理 单个链接分析 开源 https://github.com/ccbikai/sink