优质网站同好者周刊（第 077 期）

倾城之链作为一个开放平台，旨在云集全球优秀网站，探索互联网中更广阔的世界。此周刊，将汇聚过去一周倾城所收录的内容，以飨同好；欢迎推荐或自荐（仅限有独立域名的网站，可以是二级域名）。您如果要了解收录要求，请参见关于倾城。

备注：本周刊每周五生成，首发于个人微信公众号晚晴幽草轩、博客晚晴幽草轩，以及悠然宜想亭社区；此一键生成脚本基于 Deno 编写，并在 Github 开源：nicejade/nicelinks-weekly。

GitHub - vadimdemedes/ink: 🌈 React for interactive command-line apps

标签：命令行 · React · 程序

🌈 React for interactive command-line apps. Contribute to vadimdemedes/ink development by creating an account on GitHub.

倾城之链 - GitHub - vadimdemedes/ink: 🌈 React for interactive command-line apps

推荐语：term.ink 是基于 React 框架，用于构建交互式命令行（Command Line）应用程序的渲染器（render）；它提供了与 React 在浏览器中提供的相同的基于组件的 UI 构建体验。它使用 Yoga 在终端（Terminal）中构建 Flexbox 布局，因此大多数类似 CSS 的道具，也可以在 Ink 中使用。如果您已经熟悉 React，那么您已经了解 Ink。由于 Ink 是一个 React 渲染器（renderer），这意味着支持 React 的所有功能。

Ink 这对于前端极客而言，是福音般的存在；您可以基于前端技术，快速构建命令行程序，而不用关注底层；能够极大促进您编写命令行程序的热情；进一步完善您的工具流，从而让您的效果更上一层楼。这中间，Lnk 扮演了优良循环的催化剂和基建砖；事实上，基于 Ink 已经衍生出大量命令行应用程序；在此强烈推荐了解、学习、使用。

── 出自倾城之链 - GitHub - vadimdemedes/ink: 🌈 React for interactive command-line apps

Plasmo | Iterate on every push

标签：扩展 · 框架 · React

关键字：browser extension, chrome extension, developer tools, developer tooling, continuous integration, security, cybersecurity, enterprise

Plasmo is a platform for making browser extensions at lightning speed. We make it easy to build, test, and deploy browser extensions in a matter of seconds.

倾城之链 - Plasmo | Iterate on every push

推荐语：Plasmo 是一个用于开发浏览器扩展的框架、平台，支持开发者快速开发、测试、发布「浏览器扩展」，支持所有主流浏览器（如 Chrome、Firefox、Safari 等等）。

Plasmo 所提供的框架基于 React，类似于浏览器扩展的 Next.js；通过 TypeScript 支持、自动引导 manifest.json、资产生成、自动捆绑等，享受最先进的浏览器扩展开发者体验，零配置、自动化部署。基于 plasmo 开发浏览器框架，具备哪些优势呢？官方有额外给出以下好处：

开发

使用 Plasmo 的零配置声明性扩展框架更快地迭代。

测试

在数百个站点上测试您的扩展程序，并将安全漏洞留在尘埃中。

发布

简化向每个 Web 商店的提交、更新和发布。

Plasmo 框架是由黑客为黑客制作的电池组（battery-packed）浏览器扩展 SDK 。构建您的产品，不再担心配置文件和构建浏览器扩展的奇怪特性。该项目在 Github 开源，支持开发者免费使用；如果您想再进一步增强您的浏览器扩展开发，可以考虑付费（Pro），从而使用规模测试、秘密扫描等高级功能。

── 出自倾城之链 - Plasmo | Iterate on every push

SvelteKit • The fastest way to build Svelte apps

标签：构建 · Svelte · JavaScript

SvelteKit is the official Svelte application framework

倾城之链 - SvelteKit • The fastest way to build Svelte apps

推荐语：SvelteKit ，是构建 Svelte 应用最快的方法；它是可以用于构建各种规模的 Web 应用程序的框架，具有出色的开发体验，以及灵活的基于文件系统的路由（跟 Vite、Webpack、Rollup 类似）。它具有以下功能特征：

由 Svelte 提供支持

SvelteKit 是一个由 Svelte 提供支持的应用程序框架——用更小的空间构建更大的应用程序。

两全其美

具备服务器渲染（SSR）应用程序的所有 SEO 、渐进增强，以及 SPA 的流畅导航。

快速构建

借助高级路由、服务器端渲染、代码拆分、离线支持等功能开始运行。

与单页应用程序不同，SvelteKit 不会在 SEO、渐进增强或初始加载体验方面做出妥协——但与传统的服务器渲染（SSR）应用程序不同，导航是即时的，具有类似应用程序的感觉。另外，需要说明的是，目前（2022.08）仍处于测试阶段，如果您想了解更多，可以参见 Github 开源项目：SvelteKit。

── 出自倾城之链 - SvelteKit • The fastest way to build Svelte apps

Find and hire quality developers - Proxify

标签：远程 · 酷工作 · 开发者

Proxify helps companies to hire senior and vetted developers in as little as one week. Get matched with the top 2% of developers in days, not months.

倾城之链 - Find and hire quality developers - Proxify

推荐语：Proxify ，帮助公司在短短一周内，雇用高级和经过审查的开发人员。在几天内，而不是几个月内，就能与前 2% 的开发人员匹配。据其官方网站描述：22 个不同国家/地区的 350 多家公司信任 Proxify 扩展他们的开发团队。无论您的技术堆栈是什么，他们已经证明，经过审查的开发人员准备在一周内开始。Proxify 列举了应该使用他们进行招聘的原因：

在几天内而不是几个月内雇用

所有 Proxify 开发人员都经过预先审查，因此您将有一个新的团队成员准备好在几天内开始工作。不是几个月。

最好的开发商

所有开发人员都会说英语，并具有成熟的技术技能。Proxify 仅接受每月收到的 5000 多名申请者中的 2%。

有竞争力的价格

Proxify 的目标是长期结对开发人员。这就是我们比竞争对手便宜 50% 的原因。

完美的搭配

Proxify 的技术团队将帮助您找到：不仅技术合格，而且有积极性加入您的团队的开发人员。

基于 Proxify 寻求开发者，只需要三个步骤即可：

第 1 步：告诉我们您的需求

与技术经理讨论您对产品或项目的要求和目标。

第 2 步：匹配完美的开发者

几天之内，将向您展示经过精心挑选和全面审查的开发人员。

第 3 步：开始合作（无风险）

工作开始。一周内完全无风险。只有满意时才付费。

与其他平台和机构不同，Proxify 专注于帮助您以合理的价格，获得长期发展合作伙伴，而不是零时工。这就是为什么大多数团队成员都在位超过 12 个月的原因。避免惊慌失措的项目，并找到可靠的开发人员加入您的团队。

如果您是开发者，您可以通过 Proxify 平台，申请成为「开发者」，或能帮助您找到合适的工作。除了招聘业务外，Proxify 还提供了大量技术相关文章分享；有通过 Google 搜索 SPA SEO 相关答案，从而知晓 Proxify 平台的存在。

── 出自倾城之链 - Find and hire quality developers - Proxify

Render Javascript With Search Engines in Mind | Prerender

标签：SEO · JavaScript · 服务

Get higher rankings by serving search engine crawlers a static HTML version of your Javascript website, without compromising your customers’ experience.

倾城之链 - Render Javascript With Search Engines in Mind | Prerender

推荐语： Prerender.io ，它通过为爬虫提供 JavaScript 网站的静态 HTML 版本，在不影响客户体验的情况下获得更高的排名。是针对单页面应用（SPA）解决 SEO 问题的零侵入解决方案。

预渲染产生背景

如果您有从事现代前端开发相关工作，使用 Angular ， Vue ， React 等框架，进行单页应用开发，用户在浏览时，在浏览器动态请求并解析 JavaScript、CSS，然后渲染并呈现出最终的页面；用户体验比较好，网站性能也提高不少。但存在一个问题：网络爬虫并不会动态解析 JavaScript（事实上，Google 引擎会抓取，但效果上不是特别理想），访问所有 URL 得到的只是项目入口文件中的代码，不能得到具体的内容（完整 html 源码）；如此一来，网站 SEO 就无从谈起。

除了上述提及的客户端渲染 (CSR Croswer Side Render)，完全可以基于 SSR（ Server Side Render 服务端渲染）、SSG（Static Site Generation 静态页面生成）、本地预渲染（诸如 Prerender SPA Plugin ）等方案，从而解决 SEO 问题。且不说是否合适、会不会影响渲染速度，单就从实现角度，需要对已经采用 CSR 方案的项目，进行颇多修改，才能达成目的。

预渲染方案好处

而在服务端使用「预渲染」方案，则无需对现有项目改造，代码零侵入完成。其思路是：对于用户正常访问，提供构建的源码，走客户端渲染；而对于搜索引擎爬虫，则在后台启动无头浏览器，返回渲染完成后抓取 HTML 内容。Github 开源项目 prerender 即是基于这种理念：通过向 Google 和其他搜索引擎，提供预渲染的 HTML 来解决 SEO；它使用 Headless Chrome 将 javascript 呈现的页面呈现为 HTML 的节点服务器。与预渲染中间件一起使用。您可以克隆该项目，部署在自己的服务器，结合 Nginx 配置，即可开启您 SPA 项目的 SEO 之路。

Prerender.io 提供什么服务？

prerender 项目由 Prerender.io 出品（其内部基于 Headless Chrome，与 Google Puppeteer 类似），也可以使用 Prerender.io 提供的服务；它旨在加快向搜索爬虫提供内容的速度，从而提高您的 SEO 分数。只需注册、登录、按照说明进行 Nginx 配置即可；相比自己部署的 prerender 服务，有更快的速度、更多可选项设置、强大的仪表盘、缓存管理器以及其他缓存相关活动操作。

需要说明的是，Prerender.io 必须与您的 Web 服务器/后端/CDN 集成，以具有确定哪些请求将被转发到 Prererender 的机制。Prerender.io 是如何工作的？可以参见 Prerender.io 文档｜入门说明。

为什么使用 Prerender®？

相比于客户端渲染、服务器端渲染，很多场景下，动态渲染更有用武之地；服务器可以区分「人类」和「机器人」，为人类提供完整的体验，为机器人提供轻量级的 HTML 版本。为何推荐使用 Prerender？官方给出了以下几个可以说服你的答案：

让 Google 和您的用户满意

Prerender 的中间件会检测 Google 何时访问您的网站，从而生成易于抓取的版本。人类用户可以看到动态的 Javascript 版本，让您控制他们的体验。

谷歌推荐

Google 和 Bing 建议使用动态呈现解决方案来解决 JavaScript 呈现问题。事实上，Google 的文档特别推荐 Prerender®，因此您可以专注于开发并将 SEO 留给营销人员。

简单、可靠、可扩展的服务

只需快速安装我们的中间件即可。Prerender 的托管服务以 99.9% 的服务承诺负责其余的工作。

开源和社区支持

Prerender® 由关心软件的行业专家组成的热情社区维护。无论您的配置如何，他们都有解决方案。您甚至可以构建自己的服务器。

本站「倾城之链」是基于 Vue 等技术栈所开发的单页应用（SPA），且没有基于 SSR、SSG 做首屏、SEO 优化。早期基于 prerender 对搜索爬虫做了预渲染处理，由于没有进一步折腾，效果一般。目前采用 Prerender.io 提供的免费服务，可以在仪表盘看到：Googlebot 抓取频率相对很高，越来越多页面「缓存命中」；百度和必应的抓取频率比起 Google 要低太多；整体效果正在持续观察中。如果您也为单页应用 SEO 问题而发愁，Prerender.io 是非常值得关注和使用的服务。

── 出自倾城之链 - Render Javascript With Search Engines in Mind | Prerender

对倾城之链感兴趣的朋友，可通过 Web，小程序，快应用等渠道进行访问(后续将支持更多，如 VsCode 插件，Chrome 扩展等)。您有任何问题，欢迎随时向我们反馈（您可以通过官网反馈渠道），🤲 。

本期文末寄语

心体澄彻，常在明镜止水之中，则天下自无可厌之事；意气和平，常在丽日光风之内，则天下自无可恶之人。当是非邪正之交，不可少迁就，少迁就则失从违之正；值利害得失之会，不可太分明，太分明则起趋避之私。── 明 · 洪应明《菜根谭》

倾城之链作为一个开放平台，旨在云集全球优秀网站，探索互联网中更广阔的世界；在这里，你可以轻松发现、学习、分享更多有用或有趣的事物。

倾城之链 | 优质网站周刊