We are building a new browser from scratch, backed by a non-profit4 months agohttps://ladybird.org/Ladybird是一款采用网络标准优先理念的全新浏览器和网页引擎最初是SerenityOS的HTML查看器,现已支持Linux、macOS和类Unix系统的跨平台运行目标2026年发布Alpha版本,目前正处于密集开发阶段由浏览器行业资深人士领导,确保开源社区的深度参与已成立501(c)(3)非营利组织支持项目发展社区驱动模式,通过Discord和GitHub进行活跃协作通过赞助和捐赠获取资金,设有分级赞助体系
A static site generator written in POSIX shell4 months agohttps://aashvik.com/posts/shell-ssg/作者用POSIX shell创建了一个名为'gen.sh'的静态网站生成器(SSG),取代了之前基于JavaScript的方案。该SSG处理带有frontmatter元数据的markdown文件,生成HTML页面、标签系统、RSS/Atom/JSON订阅源、站点地图,并支持草稿模式。它使用'comrak'进行markdown渲染,通过大量扩展支持并排图片、标题说明和媒体自动检测等功能。脚本利用'sed'、'envsubst'和'eval'等shell工具进行文本处理、模板渲染和动态变量操作。标签系统采用自定义方案跟踪每篇文章的标签,并通过CSS交互效果生成标签聚合页面。该SSG速度极快,处理29篇文章仅需约714毫秒,设计理念强调简单有趣而非可移植性或复用性。作者计划精简订阅源仅保留Atom格式,并考虑改用bash以获得更好的命令兼容性。
Changes in htmx 4.04 months agohttps://four.htmx.org/htmx-4/htmx 4.0 使用 fetch() API 进行了完全重写,取代了 XMLHttpRequest。显式属性继承现为默认行为,使用 `:inherited` 修饰符实现。事件命名规范改为 `htmx:阶段:动作[:子动作]` 以保持一致性。历史记录存储不再使用 `localStorage`;导航时执行完整页面刷新。非200响应现在默认执行内容替换(204和304状态码除外)。新增变形交换样式(`innerMorph`/`outerMorph`)以更好地保留DOM状态。内置流式响应支持,并改进了SSE事件处理。默认启用View Transitions API实现动画化DOM状态过渡。新增脚本API提供更好的async/await支持和自定义JavaScript集成。统一请求上下文(`ctx`对象)确保事件处理一致性。引入现代化交换术语(`before`/`after`/`prepend`/`append`)。新增 `:append` 修饰符实现属性值的追加式继承。通过 `hx-status:XXX` 属性实现HTTP状态码条件化内容替换。新增 `<hx-partial>` 标签支持单次响应中的多目标替换。多个属性被重命名或移除,新增如 `hx-action` 和 `hx-method` 等属性。更新事件名称确保一致性,新增生命周期事件提升控制力。扩展现在全局注册,不再需要 `hx-ext` 属性声明。
You Still Struggle with CORS Even After Reading Docs4 months agohttps://evan-moon.github.io/2020/05/21/about-cors/en/CORS(跨源资源共享)是浏览器实现的一项安全特性,用于限制脚本发起的跨源HTTP请求。CORS错误在Web开发中很常见,特别是当客户端应用程序尝试在没有适当权限的情况下访问不同源的资源时。源由方案(协议)、主机和端口的组合定义。只有当这三者完全匹配时,请求才被视为同源。SOP(同源策略)是一项基本的安全措施,限制来自一个源的文档或脚本如何与另一个源的资源进行交互。CORS通过允许服务器通过HTTP头部指定哪些源可以访问其资源,提供了一种放宽SOP限制的方式。CORS主要有三种场景:预检请求(在发送主请求前检查权限)、简单请求(无需预检,需满足特定条件)和凭证请求(包含认证信息)。解决CORS问题需要服务器正确配置'Access-Control-Allow-Origin'头部。虽然可以使用通配符(*),但在涉及凭证的请求中会存在安全隐患。开发者可以通过Webpack Dev Server的代理功能等工具在开发环境中绕过CORS限制,但这并非生产环境的解决方案。试图通过<img>或<script>等标签嵌入资源来绕过CORS限制,仍然无法通过JavaScript访问响应数据。理解CORS机制对前后端开发者都至关重要,有助于高效协作解决相关问题。
Pandoc in the Browser with WASM3 months agohttps://discourse.haskell.org/t/ann-pandoc-3-9-wasm/13659首个官方wasm版本正式发布通过编译器构建者的工作和Tweag的初步贡献实现Wasm二进制文件大小约为16.1MB对GHC二进制文件来说很小,但对网站资源来说较大证明可行性的重要里程碑
GitHub - ruby/ruby: The Ruby Programming Language3 months agohttps://github.com/ruby/rubyRuby是一种解释型面向对象编程语言,常用于Web开发。它提供文本处理、文件管理和系统任务的脚本功能。主要特性包括简洁语法、面向对象能力、运算符重载和垃圾回收机制。Ruby具有高度可移植性,可在类Unix系统、Windows和macOS上运行。安装选项和源代码可在Ruby官网获取。开发分支和源代码可通过Git仓库访问。社区支持包括邮件列表、Stack Overflow问答平台和错误追踪系统。Ruby由松本行弘(Matz)于1995年创造。
Interop 20263 months agohttps://webkit.org/blog/17818/announcing-interop-2026/Interop 2026计划通过聚焦20项关键特性来提升跨浏览器兼容性Safari浏览器已实现contrast-color()、媒体伪类、作用域自定义元素注册等多项功能新增特性包括增强版attr()函数、IndexedDB的getAllRecords()方法、WebTransport及Wasm的JSPI接口重点领域涵盖锚点定位、容器样式查询、自定义高亮等核心功能Interop 2026还将解决滚动吸附(Scroll Snap)和CSS缩放等长期存在的兼容性问题探索性方向包含无障碍测试、JPEG XL图像格式、移动端测试及WebVTT字幕标准的未来规划
Java desktop apps with web front end (Angular, react)3 months agohttps://krema.build/跨平台(macOS、Windows、Linux)的现代化桌面应用基于Java后端,可访问完整的Java生态(Maven、Spring及各类库)支持React/Vue/Svelte或原生HTML/CSS/JS的前端框架(含TypeScript)轻量化设计,仅50-80MB体积,直接调用系统WebView而非打包Chromium相比Electron内存占用更低原生API支持文件对话框、剪贴板、通知栏、系统托盘和全局快捷键内置打包/代码签名/公证/自动更新的一键分发功能Krema CLI提供项目脚手架(React/Vue/Svelte/原生JS模板)和热重载简化的IPC(进程间通信)实现前后端交互支持npm/npx/curl快速启动
Justifying Text-Wrap: Pretty3 months agohttps://matklad.github.io/2026/02/14/justifying-text-wrap-pretty.htmlSafari在2025年推出了`text-wrap: pretty`的合理实现,显著改善了网页排版效果。历史上浏览器采用简单的贪婪算法进行换行处理,导致文本布局美观度不足。1981年提出的Knuth-Plass算法优化了印刷排版中的换行,但浏览器因动态窗口尺寸面临额外挑战。`text-wrap: pretty`旨在平衡行长,而`text-align: justify`通过调整空白实现精确对齐。Safari中同时使用`text-wrap: pretty`和`text-align: justify`可能导致单词间距过大。该问题的根源在于动态规划算法为平衡行长会略微牺牲目标宽度,这在两端对齐时尤为明显。文章呼吁修复此问题,以实现预期的网页排版美学效果。
Dictionary Compression is finally here, and it's ridiculously good3 months agohttps://httptoolkit.com/blog/dictionary-compression-performance-zstd-brotli/字典压缩技术通过使用预共享字典进行压缩,可大幅减少网络流量初期测试显示YouTube的JS文件下载量缩减高达90%,谷歌搜索HTML文件减少近50%其原理是通过引用共享字典而非重复传输数据,特别适合网页内容传输现代浏览器及Node.js/Python/Rust等后端均已支持该技术压缩字典传输协议标准化了HTTP字典共享方式谷歌/Pinterest/Shopify等实际应用案例已实现流量显著下降可通过人工构建或Zstandard等工具训练生成自定义字典需注意同源策略限制、缓存管理及严谨测试等实施要点
Never Buy A .online Domain3 months agohttps://www.0xsid.com/blog/online-tld-is-pain作者为一个小项目购买了.online域名,打破了自己一贯坚持使用.com域名的习惯。该网站突然被谷歌标记为不安全并处以serverHold状态,且未收到任何通知。在尝试解决问题时发现陷入两难境地:谷歌要求验证域名才能解除标记,但域名因serverHold状态无法解析。作者从中吸取了深刻教训:坚持使用.com域名、尽早将域名添加到Google搜索控制台、以及监控网站运行状态。在Hacker News引发公众关注后,网站最终得以恢复,但整个过程令人沮丧且耗费了大量时间。
Astro and Svelte: Why I believe they're the future of web development3 months agohttps://xergioalex.com/blog/astro-and-svelte-the-future-of-web-development/Astro和Svelte因其简洁性和高性能被推崇为未来Web开发的主流选择文章批评了现代Web开发中过度工程化的现象,指出React和Vue等框架正变得越来越复杂Astro因默认生成静态HTML而受到赞誉,它减少了不必要的JavaScript,并采用'岛屿架构'实现交互性Svelte因其基于编译器的开发方式获得好评,消除了运行时开销,并提供比Vue和React更简单直观的语法性能测试显示Astro和Svelte在速度、打包体积和Lighthouse评分上显著优于传统框架Cloudflare收购Astro被视为对其在Web开发领域重要性的认可微软、谷歌等企业的采用证明了Astro日益增长的影响力文章最后呼吁采用更简单高效的Web开发实践,推荐将Astro和Svelte作为内容型网站的首选工具
We Built a Video Rendering Engine by Lying to the Browser About What Time It Is3 months agohttps://blog.replit.com/browsers-dont-want-to-be-cameras浏览器是实时系统,由于帧时间不匹配,使得视频屏幕录制极具挑战性。曾考虑过Remotion方案,但因需捕获不受框架限制的任意网页内容而被否决。开发了JavaScript解决方案,通过用可控虚拟时钟替代浏览器时间相关API,实现确定性帧渲染。实施了预热循环机制,通过持续发出'跳帧'指令防止Chrome合成器进入停滞状态。针对<video>元素的复杂解决方案包括:服务端预处理、解复用、解码,以及与虚拟时钟同步的canvas渲染。音频捕获通过拦截Web Audio API和HTMLMediaElement调用实现,追踪播放意图并在服务端重建音频。采取额外措施确保确定性,例如禁用OffscreenCanvas,以及根据SSRF模式验证子资源请求。该方案受WebVideoCreator启发,但针对现代Chrome API和特定云基础设施需求进行了适配。计划开源该实现方案,为网页内容程序化生成视频提供技术参考。
Servo Baseline Readiness2 months agohttps://webtransitions.org/servo-readiness/Servo当前每年完成约22个特性,而基线'广泛可用'(BWA)集合每年增长约52个特性按当前速度,Servo将在2037年左右达到80%的瓶颈期,永远无法赶上BWA要实现完全的速度对等需要约44名全职员工(每年880万欧元,三年总计2630万欧元)采用分阶段方法优先处理高使用率特性,可使初期人员配置和成本降低达40%关键行动包括解封141个停滞特性和修复51个衰退特性(使用率下降超过5个百分点的特性)WPT通过率在2.5年内从30%提升至62%593个BWA特性中有439个可通过WPT测量,154个缺乏WPT映射全职员工成本按每年20万欧元估算,需考虑专业化和多学科技能因素基于使用率优先级的方案(如暂缓<1%或<5%使用率特性)可节省成本数据来源包括wpt.fyi、web-features和Servo的git历史记录
Invoker Commands API2 months agohttps://developer.mozilla.org/en-US/docs/Web/API/Invoker_Commands_APIInvoker Commands API 允许通过声明式方式为按钮分配行为,从而控制交互元素。常见用途包括控制弹出框、对话框和文本格式化,无需使用JavaScript事件监听器。关键HTML属性:`commandfor`(指定要控制的元素)和`command`(指定要执行的操作)。`CommandEvent`接口表示触发命令时抛出的事件。示例包括创建声明式弹出框、对话框,以及旋转图片等自定义命令。提供了`CommandEvent`、`command`和`commandForElement`的浏览器兼容性及规范说明。
Standardizing source maps2 months agohttps://bloomberg.github.io/js-blog/post/standardizing-source-maps/Source map是现代Web开发的关键工具,它能让开发者将编译后的代码映射回原始源代码以便调试。最初源映射缺乏官方标准,导致新增功能和跨工具一致性维护面临挑战。2009年谷歌Closure Tools的出现标志着复杂JavaScript优化的开端,凸显了对源映射的需求。源映射是一个包含版本、文件名、源代码内容和编码映射等元数据的JSON文件。源映射中的'mappings'字段采用Base64 VLQ编码,高效表示源代码与生成代码的对应关系。2011年发布的第三版源映射带来重大改进,减小了文件体积并提升了编码效率。尽管缺乏标准,通过浏览器与工具厂商的合作仍成功添加了'ignoreList'等特性。彭博社的'pasta-sourcemaps'实现了调用栈函数名映射,解决了调试时的常见痛点。2023年成立的TC39-TG4工作组推动了源映射标准化进程,最终形成2024年的ECMA-426标准。未来规划包含'Scopes'提案(优化内联函数调试)和'Range Mappings'提案(提升源码映射精度)等方向。
Vite+ Alpha: Unified Toolchain for the Web (MIT License)2 months agohttps://voidzero.dev/posts/announcing-vite-plus-alphaVite+ 采用 MIT 许可证开源,为 Web 开发提供统一工具链。整合 Vite、Vitest、Oxlint、Oxfmt、Rolldown 和 tsdown 形成一体化工具链。管理运行时、包管理器及前端工具链,实现完整本地开发周期。通过 vp env、vp install、vp dev 等命令简化 Web 开发流程。基于 Rust 工具构建,提供更快的构建、代码检查与格式化性能。支持 macOS/Linux 和 Windows 全局命令,安装流程简单直接。Vite Task 提供智能任务运行器,具备自动化缓存和依赖感知执行能力。通过 vp migrate 支持迁移至 Vite+,并兼容现有工具生态。通过 Discord、GitHub、X/Bluesky 及新闻通讯保持社区互动与更新。
Everything you never wanted to know about visually-hidden2 months agohttps://dbushell.com/2026/02/20/visually-hidden/本文探讨了'visually-hidden'这个CSS类的发展历程,该类用于在视觉上隐藏元素的同时保持屏幕阅读器可访问性。这项技术起源于2000年代初,最初是为了满足无障碍需求而开发,特别是针对'跳过导航'链接和表单标签。多年来,'visually-hidden'类逐渐积累了大量属性以应对浏览器兼容性问题,但其中许多现在可能已经过时。现代替代方案如'clip-path: circle(0)'或'transform: scale(0)'被提出作为更简洁的解决方案,但仍需充分测试以确保兼容性。文章质疑是否应该标准化原生的'visually-hidden'解决方案,但专家认为这可能助长滥用而非解决根本的无障碍问题。核心观点是'visually-hidden'应当谨慎使用,因为它常被用来掩盖糟糕的设计决策,而语义化HTML始终是无障碍的最佳实践。
How to Not Get Hacked Through File Uploads2 months agohttps://www.eliranturgeman.com/2026/03/14/uploads-attack-surface/文件上传功能会引入多个攻击面,不仅限于代码层面,还包括图像处理库、文件系统、CDN和浏览器等环节。图像处理库(如ImageTragick、libwebp漏洞)可能发生解析器漏洞,攻击者可借此执行任意命令。防范解析器漏洞的措施包括:在受限环境(容器、无服务器函数)中处理文件,并保持依赖项更新。SVG和HTML文件可能包含嵌入式脚本,若与主应用同源提供服务,会导致存储型XSS攻击。通过从独立域名(无会话状态共享)提供文件,并设置`Content-Disposition: attachment`等安全头可缓解XSS风险。文件名可能被用于路径遍历攻击(如覆盖系统文件),应使用随机标识符存储文件并验证压缩包解压路径。资源耗尽攻击(如压缩炸弹)会消耗基础设施资源,需在代理层强制执行大小限制并设置速率限制。应通过魔数字节(而非仅扩展名或MIME头)验证文件类型,并严格维护允许格式的白名单。对于用户间文件共享,应在文件可用前实施杀毒扫描。遵循涵盖验证、沙箱、安全头和依赖更新的安全检查清单来确保文件上传安全。
Framework doesn't matter2 months agohttps://cemrehancavdar.com/2026/02/19/your-framework-may-not-matter/框架性能差异在网络延迟主导响应时间的实际应用场景中可以忽略不计。数据库查询优化(如避免N+1查询)对性能的影响远超框架选择。网络延迟占优化良好查询响应时间的69-83%,这使得服务器位置至关重要。框架基准测试通常测量的是不切实际的本地环境(无数据库),无法反映真实用户体验。即使在每日百万级请求的高流量场景下,框架吞吐量差异也因充足的性能余量而无关紧要。框架选择应基于开发者体验、文档质量和生态系统,而非微观优化。真正的性能提升来自查询优化、缓存和减少网络跳数,而非更换框架。