#优质博文 #前端 #astro
Why we switched to Astro (and why it might interest you)

AI 摘要：DatoCMS 切换至 Astro 框架以简化开发体验、提升性能并降低复杂性。主要原因包括改用 TypeScript 提高代码安全性、充分利用其产品功能（如缓存标签）以及避免 React/Next.js 日益复杂的架构。Astro 的纯服务端渲染和静态生成模式消除了浏览器端的额外负担，同时允许针对部分页面进行交互式增强。最终实现了更快的缓存刷新、更高的页面性能及低成本维护。完整架构包括 VPS 托管、CDN 缓存与精确的缓存失效管理。

via THE DATOCMS BLOG

DatoCMS

Why we switched to Astro (and why it might interest you)

Follow the first article of a series in which we'll try to summarize our journey with Astro, sharing many cool little tricks and details we found out (or totally came up with) in the process.

#碎碎念 #无限暖暖
练习了一会儿春日影的成果（拉了垮了）
疑似爱音本人上号
为什么要演奏春日影！！
【【纯手弹】为什么要演奏春日影！！！疑似爱音本人上号-哔哩哔哩】 https://b23.tv/S0mB0Y2

2:03

Media is too big

VIEW IN TELEGRAM

#工具推荐 #tools #svg #editor
前阵子还在找 svg 的编辑器呢，才看到。https://www.vectorpea.com/
Photopea 开发者新作 Vectorpea：免费在线矢量图编辑器

via 小众软件

Vectorpea

Vectorpea | Online Vector Editor

Vectorpea Online Vector Editor lets you edit vector graphics, AI, SVG and PDF files!

#前端 #优质博文 #electron
构想：Electron Render OTA 更新

AI 摘要：这篇文章介绍了使用热更新方式动态更新Electron的Renderer层代码的方法。使用Vite插件打包renderer生成assets-render.tar.gz和manifest.yml，应用启动时对比最新Release的manifest信息，如果符合条件则下载更新包并更新。热更新只更新renderer层代码，不影响app.asar的完整性，用户可以无感知地更新。热更新的实现涉及在main进程中检查、下载和加载更新的资源文件，优先加载热更的renderer资源。

via innei

innei.in

构想：Electron Render OTA 更新

动机 由于 App 的版本铺量存在碎片化，用户升级不及时或者不更新，会导致版本长期停留在旧版本无法得到最快的安全性或者其他功能修复。 由于 Electron App 的全量更新需要更多的网络流量才能进行，对用户不友好。 拟使用热更的方式去动态更新 Electron 的 Renderer 层代码。

#优质博文 #前端 #css #新特性
Form Validation That Doesn't Annoy Users: CSS :user-valid and :user-invalid
AI 摘要： :user-valid 和 :user-invalid 是 CSS 新伪类，可改善表单验证体验。这些伪类与传统的 :valid 和 :invalid 不同，它们会等待用户有意义的交互（如开始输入）后才应用样式，从而避免过早显示错误状态。这种改进显著优化了用户体验，特别是在需要更灵活的表单样式时。例如：

input:user-valid { border-color: #10b981; }
input:user-invalid { border-color: #ef4444; }

via Trevor I. Lasn

Form Validation That Doesn't Annoy Users: CSS :user-valid and :user-invalid

The new pseudo-classes :user-valid and :user-invalid give us a smarter way to style form validation states based on user interaction

看笑了，真是这个成就

#碎碎念
今日最大乐子：TGA 年度最佳游戏宇宙机器人
望着我 ps5 上的小机器人陷入了沉思，我真都玩了
叠这么多层甲有意思吗，这真不配吧
“销量裁员什么的都不能证明什么”
“算了，反正一切都没有意义”🤔
这下真野鸡奖了，这游戏我这个大怨种真买了，因为很喜欢前作机器人。
400多的价格，体量也就十几个小时，还  ps5 独占

我趣，黑猴有更新了！我又火星了
妲喵说它 steam 还没更新
epic 昨天就更了🌚

《黑神话：悟空》发布全新更新公告！ 添加挑战玩法，行旅图等！

《黑神话：悟空》官网在今日发布了1.0.12.16581版本的更新公告，将为游戏带来全新的挑战玩法和行旅图等内容。目前该更新已在Epic Games平台上线，官网公告中也表示其他平台的更新将陆续推出。

更新前提醒

由于平台更新机制，您的电脑需提前预留较大的空余磁盘空间，用于更新文件的临时存储。

如果您已在游戏中安装过MOD，更新补丁后，由于MOD的版本兼容问题，可能会导致您无法启动游戏，或游戏过程中触发报错弹窗。如出现类似情况，我们建议您先卸载已安装的MOD，重新检查游戏安装文件的完整性，再重新启动游戏。

如果您在补丁安装过程中遇到更新体积异常的情况，或更新后顿卡/闪退/无法进入游戏，请查阅官网的游戏安装及补丁更新FAQ。

本次更新的所有新增物品，不影响游戏原有成就的达成条件。

主要更新内容

新玩法：挑战

“说难也难，众圣降凡。”

· 天命人通关至少一次游戏后，便可通过任一土地庙开启【挑战】

· 【挑战】分为【复战】与【连战】两个玩法

· 【复战】

可与昔日对手再次比试，共有三重难度

游戏流程中若有未曾战胜的对手，无法开启与之对应的【复战】

· 【连战】

可与昔日对手进行轮番比试，亦可自选禁制，进一步增加难度

该玩法颇具挑战，部分昔日对手还会施展与往昔不同的招式。谨慎！谨慎！

游戏流程中若有未曾战胜的对手，则无法开启与之相关的【连战】

任一【连战】通关后，均可获取新的珍稀宝物

丹药：【宝鳞丸】及其丹方

酒食：【苦酒】、【九秋菊】、【肉角】

珍玩：【石虎节】、【满堂红】、【神铁碎片】

披挂：【三山冠】

兵器：【磬槌】、【兽棍·神锋】、【昆棍·不僵】

新功能：行旅图

“取经的还去取经，走路的还去走路。”

· 有异人画下这山水风光，整理成图，可作引路、标记之用

· 天命人初入黑风山见到黑风山土地后解锁第一张【行旅图】

· 后续每行至新的地界，都可前往土地庙购买该地界的【行旅图】

新披挂：彩金套装

时值岁末，给各位天命人拜个早年！祝大家四时吉庆，八节康宁。

· 为庆祝即将到来的中国农历春节而特别打造的披挂，共有四件

· 更新后，所有天命人都可通过任一土地庙的【谢礼】选项直接领取

小曲功能优化

· 新增游戏原声音轨应用《黑神话：悟空游戏音乐精选集》（部分曲目由于版权原因不支持下载）

注：受EPIC平台配置影响，部分购买了《黑神话：悟空 豪华升级包》的用户可能会延迟获得该游戏音乐精选集，请您耐心等待

问题修复
怪物

· 修复【头目·沙国王父子】被击杀后有可能不掉落【精魄·沙二郎】的问题
· 修复【妖王·亢金星君】在特定情况下会异常死亡的问题
· 修复【猪八戒】在特定阶段无法将其击败的问题
· 修复【妖王·小黄龙】在特定情况下会陷入地下的问题
· 修复【妖王·小黄龙】部分技能被化解后无法被打断的问题
· 修复【头目·云里雾·雾里云】在特定情况下隐身后还在攻击天命人的问题
· 修复【头目·浪波波】在特定情况下无法进入战斗的问题
· 修复【二郎显圣真君】部分技能会对天命人造成异常伤害的问题
· 修复特定操作下，天命人以非“猿”形态参与四大天王战斗的问题
· 修复特定情况下，天命人会被挡在空气墙外导致无法进入战斗的问题
· 优化【妖王·黄风大圣】投技表现
· 缩短【翠笠武师】不可被攻击的时间
· 使用【法宝·定风珠】可更好地应对【头目·不空】
· 优化【头目·云里雾·雾里云】的战斗体验
· 优化【头目·碧臂螂】的战斗体验
· 优化【大圣残躯】的战斗体验

关卡

· 修复特定情况下猪八戒不出现在花果山的问题

主角

· 优化天命人连续取用丹药的体验
· 优化天命人使用切手技、蓄力重棍的体验
· 优化变身系天赋的描述
· 修复特定操作下，化身技的伤害判定一直存在的问题
· 修复特定操作下，触发了救命毫毛效果却不播对应动画的问题
· 修复【大力王面】在无敌状态（翻滚、闪身、识破）下受到攻击也能获得棍势的问题

交互

· 小曲播放器进度条支持拖动
· 键鼠自定义键位功能支持鼠标侧键
· 修复手柄类型二按键布局下，无法显示疾奔按键图标的问题
· 修复特定操作下，行囊界面有可能不显示内容的问题
· 修复特定操作下，UI会出现偏移的问题
· 修复部分文本中的错别字
· 优化影神图的部分中文文本

声音、字幕

· 修复部分音效错误
· 修复部分头目和妖王语音播放异常的问题
· 优化部分音效的音量

性能

· 修复部分用户在开启DLSS帧生成后偶现的闪退问题
· 修复部分用户在开启XeSS后画面闪烁的问题
· 修复特定情况下的内存泄露问题
· 修复部分旧版本驱动导致的崩溃问题
· 优化大量场景、头目和妖王战斗在中、低配置下的性能
· 优化GeForce RTX全景光线追踪的表现

本地化、其他

· 新增语言设置：土耳其语
· 新增部分语言的部分影神图翻译，并优化了部分语言的翻译
· 修复部分语言的翻译错误以及拼写、大小写，和术语一致性错误
· 优化部分语言的歌词翻译
· 优化部分英文配音效果和与字幕的匹配效果
· 优化部分语言的文本显示效果

https://api.xiaoheihe.cn/v3/bbs/app/api/web/share?link_id=140414879

📣 频道：@BlindGamer
💬 群聊： 点击加入
🤖 投稿：@BG_pm_bot

#优质博文 #前端 #性能优化 #react
How To Improve INP: React⚛️

AI 摘要：文章探讨了如何在 React 应用中优化 INP（Interaction-to-Next-Paint）以提升用户体验。这包括启用并发渲染（使用 startTransition 和 <Suspense> 实现选择性/渐进式 Hydration）、通过 CSS 提供即时反馈、用 useAfterPaintEffect 替代同步 useEffect 以减少阻塞渲染、以及中断冗余任务（例如通过 AbortController ）。建议尽量避免长时间运行的任务、优先处理用户可见的内容，同时利用 React 18 的新特性提升性能。

via kurtextrem

kurtextrem.de

How To Improve INP: React⚛️

All-in-one guide for improving Interaction-to-Next-Paint (INP) Core Web Vital in React applications. Introduces the useAfterPaintEffect hook.

#优质博文 #响应式 #前端 #移动端适配 #css
Control the Viewport Resize Behavior on mobile with interactive-widget

AI 摘要：文章介绍了通过 interactive-widget 关键字在 <meta> 标签中控制移动设备上虚拟键盘弹出时的视口调整行为。默认情况下，虚拟键盘会调整视觉视口（Visual Viewport），但不会影响布局视口（Layout Viewport）。通过设置 interactive-widget=resizes-content ，可以让布局视口也随之调整，从而使视口单位动态变化。该功能已在 Chrome 108+ 和 Firefox 132+ 支持，但 Safari 尚未实现。

via HTMHell

Control the Viewport Resize Behavior on mobile with `interactive-widget` - HTMHell

A collection of bad practices in HTML, copied from real websites.

#follow #碎碎念
刚刚发现可以生成无限制数量的邀请码了~ 爆10个邀请码，实在想要没有的可以评论区找我要一下w
B8GfZZXbzn
dXGYtzaQwB
pSo0xu8yye
Q0KhfmRpEt
e0U3K9cfRp
vT6uWEoEYm
J0YPr82Xvs
HJCp3K9lju
cnqUFZs7PE
Kzqbwl_K0f