#2 互联网之子想要看到的世界

codeep
cover

Hi，您正在阅读的是《Codeep 半月刊》第 2 期。本期头图是 2012 年亚伦·斯沃茨在反对《禁止网络盗版法案》的抗议活动上发言，他说，“我们赢了这场战斗，因为每个人都把这件事当做是他们自己的事，关乎切身自由的事。”

📍 学技术

CSS :has() 交互式指南

https://ishadeed.com/article/css-has-guide

这是一篇关于 CSS :has() 选择器的可交互指南。CSS :has() 是一个强大的新选择器，允许根据元素的后代来设置样式，它解决了之前无法根据后代元素的存在来设置祖先元素样式的问题。下面总结下 :has() 常用用法，文章中还有更多场景用法。

检查元素是否包含特定后代：

  • .element:has(descendant) {...} - 存在任何指定后代时应用样式
  • .element:has(> descendant) {...} - 仅当指定后代为直接子元素时应用样式
  • .element:not(:has(descendant)) {...} - 不存在指定后代时应用样式

INP 正式成为核心页面指标

https://web.dev/blog/inp-cwv-launch

A diagram showing INP's progress in the Web Vitals program in three phases. Beginning in May 2022, INP was introduced by Chrome as an experimental metric. In May 2023, it was announced that INP would become a Core Web Vital in March 2024. Now, we're formally introducing INP as a Core Web Vital, replacing FID.

核心页面指标 (Core Web Vitals) 是 Google 提出的一组用于衡量网页体验的关键指标，它关注于网页的加载性能、互动性和视觉稳定性等方面。Core Web Vitals 原本包含以下三个指标：

  • 最大内容绘制 (Largest Contentful Paint, LCP)：测量从页面开始加载到最大文本块或图像元素渲染完成的时间，反映了加载体验。
  • 累积布局偏移 (Cumulative Layout Shift, CLS)：测量在网页生命周期内发生的意外布局位移的总计分数，反映了视觉稳定性。
  • 首次输入延迟 (First Input Delay, FID)：测量从用户第一次与页面交互 (点击链接、点击按钮等) 到浏览器实际响应这一交互之间的时间延迟，反映了交互体验。

现在，INP（Interaction to Next Paint）将作为新的核心页面指标取代首次输入延迟 (FID)，Chrome 正式弃用对 FID 的支持。INP 用于衡量页面响应用户交互的速度。它测量点击、单击或按键与浏览器在屏幕上进行下一次绘制之间所经过的时间。

由于 Google 将这些指标作为搜索引擎排名的一个重要参考因素，所以对于 Web 开发者来说尽早地了解即将到来的变化可以让我们有更多的时间准备来迎接它，优化这些指标有助于提高网站的用户留存率和转化率。

📕 深阅读

互联网之子 Aaron Swarts 想要看到的世界

Tim-Swartz

https://jhuo.ca/post/talk_with_jade_aaron/

这篇文章是本期半月刊的标题来源，是一篇交谈形式的文字，记录了 Jade 和霍炬之间的对话，深入探讨了互联网从诞生到现在的发展历程，包括互联网早期先驱者的理念、技术商业化与开源运动的矛盾等内容。但是我这里只想讲讲 Aaron Swartz（亚伦·斯沃茨），“互联网之子”是一部关于他的纪录片《The.Internet's.Own.Boy.The.Story.of.Aaron.Swartz》的中文译名。

亚伦·斯沃茨的生平事迹和所坚持的理念，足以彰显他是一位真正的的互联网之子。我在看完纪录片后查找与他更多的相关资料时才发现，与我平时获取信息相关的 RSS 协议和此时写这段文字在用的 Markdown，斯沃茨都有参与开发，而且都是在他十几岁的时候，实在是令我敬佩。

但是更让我佩服的是他在年纪轻轻便有足够的智慧可以洞悉世界运行的真相，并看穿其中的不合理之处。他相信自己生来就是为了改变世界的，他相信自己具有这个能力，而且他证明了这点。而我有时在表达自己观点的时候都会怀疑自己是否相信自己所说的话。正如 Tim Berners-Lee 所说，我们失去了一位导师、有远见睿智的长者。但是亚伦·斯沃茨让我重新审视内心，那就是认识自己的才能，永远做那些你喜欢的和你认为对的事。

✨新鲜货

DevToysMac

https://github.com/DevToys-app/DevToysMac

DevToysMac

由微软的工程师 Étienne BAUDOUX 开发的 DevToys 开源工具，支持超过 28 个开发者常会用到的工具，例如将 JWT 解密工具、JSON 格式化的工具、Base64 编码与解码的工具、测试正则表达式等工具，全都免费使用。

🍔 技术外

如何制作落地页：保姆级实操指南

https://www.bmms.me/blog/landing-page

之前一直听说过落地页，但是对其具体概念一直不是很理解，刚好看到有人总结提炼出一篇落地页操作指南，可以让像我这样对落地页感兴趣的人比较系统全面的了解相关概念。

落地页的设计目的非常专注，就是将流量转化为预期行为，比如让用户下载你的产品，让用户订阅你的 newsletter 等等。落地页上面的内容都是围绕着这个转化目标而设计，设计上会避免过多干扰影响用户注意力，利用针对性内容最大化提高转化率。

获取 SSH 端口 22 的故事

https://www.ssh.com/academy/ssh/port

这个故事可以追溯到互联网的早期。Tatu Ylonen 设计了 SSH 协议，该协议可以替代 telnet（端口 23）和 ftp（端口 21），端口 22 当时是空闲的，位于 telnet 和 ftp 端口中间，Tatu 认为获得这个端口号会让 SSH 显得更有公信力。

当时分配端口号的权威机构是 IANA，由 Jon Postel 和 Joyce K. Reynolds 负责。Tatu 虽然对开发互联网主要协议 RFC 的大师般人物 Jon Postel 感到由衷的敬畏，但还是给 IANA 发了申请邮件。没想到第二天就收到了正式将端口 22 分配给了 SSH 协议的回复。就是如此容易，去询问你想要的东西，你就会得到它。

本半月刊在本人博客首发，每月 15 号和月底更新，欢迎您关注、转发！

codeep