Crafting your own Static Site Generator using Phoenix (2023)10 months agohttps://fly.io/phoenix-files/crafting-your-own-static-site-generator-using-phoen...使用Elixir从零开始构建静态网站生成器(SSG)的入门指南使用NimblePublisher解析Markdown和Front Matter集成Phoenix组件进行HTML渲染配置Tailwind和Esbuild处理CSS和JavaScript使用Mix任务自动化构建流程采用Docker和Fly.io的部署策略重点展示Elixir在静态网站生成中的简洁性与强大功能
PHP-ORT: Machine Learning Inference for the Web10 months agohttps://krakjoe.github.io/ort/软件和机器学习正在快速发展，使得ML成为所有数字交互的核心要素PHP开发者面临在AI优先的世界中保持相关性的挑战，这关乎他们的职业发展和生计保障PHP以78%的使用率主导网络开发，但缺乏一流的ML支持，迫使开发者使用低效的变通方案PHP-ORT为PHP带来生产级ML推理能力，让开发者能轻松构建智能应用程序PHP-ORT特性包括张量API、高性能数学库、ONNX集成和SIMD加速支持该解决方案旨在让PHP(推理)与Python(训练)互补而非替代核心创新包括不可变张量、双存储类张量及优化的内存管理机制PHP-ORT已具备生产就绪性，经过严格工程验证、性能基准测试并提供简易安装该项目回应了关于PHP是否适合ML的质疑，强调生态发展和基础设施构建目标是让PHP开发者普及ML技术，推动创新并确保PHP在AI时代保持竞争力
Ladybird Browser July Update9 months agohttps://ladybird.org/newsletter/2025-07-31/7月共合并了来自47位贡献者的319个拉取请求新增赞助商：Scraping Fish（5000美元）和Blacksmith（CI基础设施）Web平台测试(WPT)进展：新增13,090项通过测试（总计1,831,856项）由于postMessage实现的修复，Google reCAPTCHA现已支持通过新增高刷新率支持（requestAnimationFrame最高支持120Hz）通过curl 8.14.0和OpenSSL后端启用HTTP/3支持新增初始Trusted Types支持以防范XSS攻击SVG foreignObject重大改进，提升HTML-SVG整合效果新增对伪元素的CSS content: url(...)支持新增伪类选择器：:state(foo)和:unchecked逻辑属性组现已在编译时生成重写任意替换函数（var(), attr()）以符合规范要求新增对属性值的CSS <syntax>解析支持@property和CSS.registerProperty()功能开发取得进展LibJS已过渡至原生UTF-16字符串以提升网页兼容性
Show HN: Spatial Web Browser Engine9 months agohttps://m-creativelab.github.io/jsar-runtime/每个HTML元素在浏览器中都是通过JSAR进行空间渲染的。Web开发者可以使用HTML5、CSS3和TypeScript创建沉浸式体验。JSAR支持现代Web标准；详情请查看浏览器兼容性数据。提供构建首个空间Web应用的指南文档。加入致力于空间Web开发的开发者社区。
The Toyota Corolla of programming9 months agohttps://deprogrammaticaipsum.com/the-toyota-corolla-of-programming/PHP和JavaScript均于1995年发布，成为网页开发的基石技术两种语言虽曾受质疑，最终支撑起了互联网的庞大版图PHP与JavaScript在1997年实现标准化，2010年代获得主流技术生态支持PHP常遭调侃却驱动着70-80%的网站，以低成本和高易用性著称现代PHP已包含面向对象特性、函数式编程结构和健全的生态系统PHP的进化包含年度稳定版本发布和安全机制强化新兴运行时FrankenPHP致力于使PHP适配DevOps和容器化环境尽管持续改进，PHP仍因早期设计缺陷承受负面评价社区驱动的开发模式是PHP保持生命力的核心因素
A Few Things About the Anchor Element's Href You Might Not Have Known9 months agohttps://blog.jim-nielsen.com/2025/href-value-possibilities/锚元素的href属性可以使用多种协议，如mailto:、tel:、sms:和javascript:。协议相对链接可以通过href="//"来使用。文本片段允许使用href="#:~:text=foo"链接到页面上的特定文本。href="#"或href="#top"会滚动到文档顶部。href=""会重新加载当前页面，保留搜索字符串但移除哈希部分。href="."会重新加载当前页面，移除搜索和哈希字符串，但需要尾部斜杠才能正确执行。href="?"会重新加载当前页面，移除搜索参数和哈希，但保留问号字符。数据URL可通过href="data:text/plain,hello%20world"导航到纯文本内容。媒体片段如href="video.mp4#t=10,20"允许链接到媒体文件的特定部分。可以使用JavaScript的URL构造函数来测试不同href值的解析方式。
What Is Popover=Hint?9 months agohttps://una.im/popover-hint/HTML中的`popover="hint"`属性允许打开提示弹窗，而不会关闭堆栈中的其他弹窗。这对于工具提示或预览卡片非常有用，例如Twitter或Facebook上的个人资料预览。存在三种弹窗类型：`auto`、`manual`和`hint`，每种在轻触关闭和其他弹窗关闭行为上有所不同。演示展示了`hint`弹窗如何保持打开状态，而`auto`弹窗仍处于活动状态，尽管点击`hint`弹窗可能会关闭`auto`弹窗。需要JavaScript事件监听器来管理`hint`弹窗的悬停和键盘交互。实验性的`interestfor` API支持声明式悬停/聚焦触发的弹窗而无需JavaScript，目前仅在Chrome Canary中通过标志启用。`popover="hint"`和`interestfor`简化了构建分层UI元素（如工具提示和预览）的过程。
HTML Is Dead, Long Live HTML9 months agohttps://acko.net/blog/html-is-dead-long-live-html/Chrome浏览器的document.body已膨胀至350多个键值，CSS属性多达660项，导致DOM变得复杂低效Web Components和语义化HTML未能达到预期效果，存在笨拙的API和模糊的规范指引CSS布局模型令人困惑，'由内而外'和'由外而内'两种思路导致不可预测的渲染行为SVG与CSS功能重叠但存在不一致性，图形渲染被迫在两者间做出取舍类似'Canvas中渲染HTML'的提案存在缺陷，既未解决核心问题又引入新复杂度Use.GPU等项目的类HTML渲染器证明，更简单高效的解决方案是可能实现的浏览器厂商和替代浏览器项目（如Servo、Ladybird）有望引领DOM体系的重构新一代DOM设计应聚焦多线程、安全性、现代UI需求，同时摒弃历史包袱
Phoenix 1.8.0 Released9 months agohttps://phoenixframework.org/blog/phoenix-1-8-releasedPhoenix 1.8.0 发布，带来生活质量改进新增 AGENTS.md 文件以增强LLM辅助开发添加暗黑模式支持以提升用户体验phx.gen.auth 现在默认使用魔法链接认证引入作用域机制实现安全可扩展的数据访问集成 daisyUI 实现 Tailwind 主题和组件通过简化代码生成器优化入门流程重构嵌套布局实现更佳定制性保持向后兼容的版本（含部分弃用功能）
Litestar Is Worth a Look9 months agohttps://www.b-list.org/weblog/2025/aug/06/litestar/Litestar是一个异步优先、类型提示驱动的Python Web框架，以其简洁性和灵活性著称。与FastAPI等框架不同，Litestar的路由装饰器是独立函数，避免了多文件应用中的循环导入问题。Litestar支持多种模式定义（Pydantic、dataclasses、msgspec），并提供DTO助手以减少样板代码和错误。它提供出色的SQLAlchemy集成，包括通过Advanced Alchemy实现的自动仓库模式和服务层抽象。Litestar的架构让人联想到Spring Boot，兼具微型框架的轻量感和大型框架的可扩展性。
Show HN: Aura – Like robots.txt, but for AI actions9 months agohttps://github.com/osmandkitay/auraAURA是一个开放协议，旨在让AI代理能够理解和操作网站。它引入了一个标准化的机器可读层，超越了传统的屏幕抓取和DOM操作。AURA通过清单文件(aura.json)以标准化格式声明网站功能。功能是指代理可执行的离散操作，每个操作映射到特定的HTTP请求。该协议包含动态HTTP头(AURA-State)用于传递上下文和可用功能信息。代码库包含核心包、参考服务器和参考客户端等实现组件。演示案例包括运行服务器、使用代理执行功能以及索引爬虫等。AURA追求社区化采用，提供多种语言编写的Web框架适配器和客户端。该项目定位为公共产品，旨在培育更智能、更具互操作性的网络生态。
Infinite Pixels9 months agohttps://meyerweb.com/eric/thoughts/2025/08/07/infinite-pixels/作者探讨了在不同浏览器中使用'无限大'数值进行CSS像素计算时的表现差异Safari和Chrome浏览器对宽高的计算值接近2^25-1（33,554,431像素），存在微小差异Firefox表现出异常行为：计算高度基于默认行高，而宽度值在布局阶段会减半字体大小测试显示：Safari存在硬性上限（100,000px），Chrome为10,000px，而Firefox采用32位浮点数处理行高测试结果与宽高测试类似，但Firefox的计算值与实际布局值存在显著偏差作者邀请业界解释这些现象，并暗示将继续进行CSS负无穷大值的实验
HTTP Is Not Simple9 months agohttps://daniel.haxx.se/blog/2025/08/08/http-is-not-simple/HTTP并非简单的协议，尽管存在普遍的误解。HTTP/1可能因可读文本和基础用例显得简单，但其底层机制非常复杂。HTTP/1.1引入了如管线化和100状态码等特性，这些功能鲜少使用却增加了实现复杂度。HTTP标头可任意长度、使用不同换行符，甚至可折叠或合并，这些规则加剧了复杂性。判断HTTP/1消息体结束并非易事，需处理多种方法：Content-Length、分块编码或Connection: close。HTTP中的数字解析因格式多样性和整数溢出等问题，既低效又容易出错。HTTP/1.1规范已从初版18,615字暴增至最新版95,740余字，体量显著膨胀。现代HTTP实现必须支持cookie和认证等额外功能，这些都不属于核心协议规范。HTTP方法和标头缺乏统一实现，导致互操作性问题频发。浏览器实现常优先考虑用户体验而非严格遵循协议，这间接影响了HTTP行为。尽管复杂，HTTP/1仍在小型应用和物联网领域广泛使用，因其高效且CPU占用低。未来HTTP版本预计将持续增加复杂度，延续协议演进的趋势。
Events9 months agohttps://developer.mozilla.org/en-US/docs/Learn_web_development/Core/Scripting/Ev...事件是指系统中发生的动作或情况，系统会通知代码以便做出响应。事件可以是用户交互（如点击、按键），也可以是系统动作（如页面加载或表单提交）。事件监听器用于检测事件，而事件处理程序则是响应这些事件而运行的函数。`addEventListener()` 方法是向元素添加事件监听器的推荐方式。可以通过 `removeEventListener()` 移除事件，以便动态清理或更改行为。可以为同一事件添加多个事件监听器，从而允许对单个事件做出多种响应。除了 `addEventListener()`，还可以使用事件处理程序属性（如 `onclick`）和内联事件处理程序，但不推荐后者。事件对象提供了事件的额外上下文信息，例如目标元素或按下的具体按键。某些事件可以通过 `preventDefault()` 阻止默认行为，这在表单验证中很有用。事件不仅限于网页，其他环境（如 Node.js 或浏览器扩展）也有自己的事件模型。
A gentle introduction to anchor positioning9 months agohttps://webkit.org/blog/17240/a-gentle-introduction-to-anchor-positioning/锚点定位允许基于另一个元素的位置来放置元素，通过CSS简化响应式菜单和工具提示的实现在锚元素上使用`anchor-name`属性，在目标元素上使用`position-anchor`属性建立关联通过`position-area`属性和逻辑属性（如`block-start`和`inline-end`）定位元素，增强包容性设计`position-try`属性可在空间受限时（如移动设备）动态调整元素位置`anchor()`函数根据锚点边缘对齐元素，同时支持物理属性和逻辑属性结合`calc()`与`anchor()`进行微调定位，可兼顾内边距等偏移量`position-area`和`anchor()`提供了灵活的定位方案，适应不同的设计思维模式
Show HN: I built a free alternative to Adobe Acrobat PDF viewer9 months agohttps://github.com/embedpdf/embed-pdf-viewerEmbedPDF是一个与框架无关、采用MIT许可证的PDF查看器，适用于任何JavaScript项目兼容React、Vue、Svelte、Preact和原生JS功能包括批注、真实密文遮盖、搜索、文本选择、缩放、旋转和平滑滚动提供可插拔架构和可tree-shake的插件系统通过贡献指南和GitHub讨论鼓励开发者参与贡献基于MIT许可证开源
Show HN: Modelence – Supabase for MongoDB9 months agohttps://github.com/modelence/modelenceModelence 是一个面向初创企业的全栈TypeScript框架。它旨在消除标准Web应用开发中的样板代码。功能包括身份认证、数据库配置、定时任务、AI可观测性和邮件服务。提供快速入门指南帮助开发者开始使用Modelence。
CSS custom functions are here!!9 months agohttps://una.im/5-css-functions/CSS自定义函数现已在Chrome 139中可用，支持动态且有组织的CSS样式编写`@function`规则允许在CSS中执行逻辑操作，可接收参数并返回值文章介绍了五个实用CSS函数：取反运算、透明度调节、流体排版、条件性圆角边框及响应式侧边栏布局额外功能扩展了`light-dark()`主题系统，使其不仅支持颜色更可应用于多种样式属性未来CSS特性如`@mixin`和`@apply`将带来更强大的样式控制能力
Document.write9 months agohttps://vladimirslepnev.me/write文章讨论了在静态站点中使用`document.write()`进行HTML模板化的方法。解释了如何通过`document.write()`在函数调用处直接插入HTML内容。提出了安全使用`document.write()`的两条规则：仅在文档顶层或名为'write'的函数中调用，且禁止用它输出`<script>`或`<style>`标签。强调了`document.write()`对简单站点的优势，例如开发速度和便捷性。提及了该方法的缺点，包括对JavaScript的依赖以及`document.write()`已遭废弃的现状。推荐了更安全的替代方案，例如使用`document.currentScript.replaceWith()`实现原位元素插入。文章最后探讨了SEO兼容性问题和所述技术的局限性。
HTTP Caching9 months agohttps://developer.mozilla.org/en-US/docs/Web/HTTP/Guides/CachingHTTP缓存通过存储响应实现复用，可降低服务器负载并提升响应速度。缓存主要分为两类：私有缓存（用户专属）和共享缓存（多用户共用）。私有缓存存储个性化响应，共享缓存则包含代理缓存与托管缓存。启发式缓存机制允许在缺少明确Cache-Control头时仍存储响应。缓存响应的新鲜度取决于其存在时间与max-age的对比关系。验证机制（If-Modified-Since、If-None-Match）可刷新过期的缓存响应。缓存清除通过修改静态资源URL实现，从而支持长期缓存策略。主资源（如HTML）通常采用no-cache策略确保实时更新。托管缓存（CDN、Service Worker）提供高级控制功能，例如更新时的缓存清除。