英语原文在此：https://ducin.dev/what-is-frontend-architecture
一开始看到了其他人的翻译，比较认可这篇文章的不少内容，所以进行一个转载，但又不想纠结于一些版权方面的问题，所以干脆基于原文让最近大火的 DeepSeek R1 帮我翻译一遍。
当你思考系统设计时，不要纠结于技术选型，而应聚焦于你希望系统具备的核心特性。技术选型只是这些特性的载体。 —— Gregor Hohpe
免责声明：如果你自认为只是个”码农”，请立即关闭本页面😉
前端社区存在一个普遍问题😉：我们过度关注库、框架、打包工具、GitHub star 数等次要因素。我们常会狂热追捧某个工具（比如2015-2016年的Redux），然后滥用它。
23 年因为 AI 的兴起搞了个微信公众号和小程序，没想到微信的算法给推了一波流，爆了几篇文章，粉丝数在 24 年过年时候就已经到 1500 了，微信给了 1200 个红包封面，当时应该还是个稀罕货，挺有意思。
25 年的春节又来了，这次微信更大方了，给了我 6000 个红包封面，但大概率我一个都发不出去了。
自从 openAI 带了这波 AI 热潮，很多工程师开始着手开发 AI 应用。比如我写了几个小程序，效果上看还不错的一个是AI绘图领域的。
这个小程序目前累计用户高达3.6万，日UV却只有100-200之间波动。留存率非常低，活跃用户留存仅10%-20%，新用户更惨，7日留存基本在1%-5%左右徘徊。
前置内容：
R2的存储空间虽然很便宜，但图片尺寸仍然应该尽可能小，节约存储空间的同时也减少传输体积，节约加载时间。所以图片在上传前最好是能压缩一下。目前非常好用的压缩图片的工具网站是 tinypng，所以之前一般是手动去 tinypng 对图片进行压缩后再上传，但这样很麻烦，所以今天我们来加一步逻辑给自动处理。
忘记之前在哪看到，说欧美市场现在普遍流行的组件库方案不是 AntD，也不是 mui，而是 shadcn-ui ，没听说过这个之前，最近碰巧看到 Solid-ui ，是一个非官方的 shadcn-ui 的 SolidJS 版本实现，就对其本体也很感兴趣，打开看了觉得有点意思。
上次分享了一篇使用 cloudflare 作为个人图床的方案，但是比较粗糙，仅仅是直接使用 cloudflare 的 R2 的控制台上传图片，自己拼接图片地址，属于能用，但并不好用的状态。
这次我们更产品一点，做一个可视的个人图床应用，包括图片上传、删除、查看、搜索。如果需要将其真正用于生产，还需要一个域名，因为 cloudflare 的免费 dev 域名是被墙掉的。
2023年11月底，拼多多的股票市值超越了阿里巴巴，目前还很难说是否会再反复变化排名，但是显然阿里巴巴已经不再是电商领域独一无二的王，BAT的时代已经彻底落幕。
2013年刚上大学时听到的BAT，当时排名第一的是百度，第二阿里第三腾讯。因为是相关专业，当年不仅记住了这三家大公司，还记得三家所长，所谓“百度的技术、阿里的运营、腾讯的产品”。
10年过去了，吹技术的百度率先掉队，吹运营的阿里也初见颓势，吹产品的腾讯暂时笑到了最后。
一个嘲笑印度、日本人说英语的笑话：两个印度人在嘲笑日本人的英语发。”Jabonese agcent is vedy, vedy hard to undershdand.” 然后被日本人神吐槽 “Indeian ekusento ishi belly belly haudo tsu andasudando.”
以前总觉得中国人说英文的发音还是蛮标准的，至少比印度人、日本人好多了，结果知乎上逛到一个毁三观的结论。对于英国/美国人来说，说英语便于理解的程度大概是，印度人 >> 日本人 ≈ 中国人。
写 API 接口时，我们通常希望有个统一的结构包裹一下要返回的数据，每个接口分别去写不光繁琐，还容易不一致，所以一般会用一个统一的拦截器来实现这个功能。各种语言的不同框架基本都有对应的拦截器写法，今天分享下 nestjs 里如何编写拦截器和如何跳过拦截器。