Linux迷+Python粉

Python开发前端Web程序指南：无需写HTML、CSS、Javascript代码的多种实现概览

2023-10-13T18:18:00+08:00

本指南旨在帮助您快速找到以Pure-Python方式进行Web前端应用程序开发解决方案，含【理论】和【实战】两个方面。如果您了解理论，请跳到下面的“理论介绍”部分。否则只需直接跳至实用指南并选择适合您的内容阅读即可。

理论介绍¶

欢迎来到 100% 纯 Python Web 开发世界，向 HTML/JS/CSS 缝合怪说再见吧。早在 WWW 出现之前，100% 纯 Python Web 开发背后的驱动概念就已在经典软件工程文本”计算机程序的结构和解释”的第 4 章中得到了体现：

毫不夸张地说，这是编程中最基本的思想：\ 决定编程语言中表达式含义的求值器只是另一个程序。\ 认识到这一点就需要改变我们作为程序员的形象。我们逐渐将自己视为语言的设计者，而不仅仅是他人设计的语言的使用者。

阿贝尔森和萨斯曼”计算机程序的结构和解释”

Python可以完成非常广泛领域的各种事情，当然也包含使用Python开发Web前端应用程序，这是通过把Python作为生成 CSS/HTML/JS 等目标语言代码的元语言方式进行的（译者：即python生成html+css+js/ts代码）！

请您想一下，我们已经知道，使用Python字典处理JSON无比丝滑，使用类似lxml的工具库能方便地来生成XML。我的意思是用Python 处理 XML 和 JSON 的收益是无可争议的，且在编程时被广泛认可。因此同样地，我们正在寻求使用 Python 作为 HTML/JS/CSS 的元语言。

这极大地简化和抽象了 Web 应用程序开发。在网络出现之前，图形应用程序主要是用单一语言开发的。文本应用还是这样。Web 应用程序经历了一些阶段，我在其他地方讨论过：

服务器端包括
CGI脚本
Java 小程序
使用后端和前端开发的客户端-服务器部分页面重新加载的应用程序

尽管我们处于第 4 阶段，但第 3 阶段是一种更加统一的 GUI 开发方法，与 Web 之前使用 X-windows 和 C/TCL/Smalltalk 开发 GUI 应用程序的方式非常相似。

目前问题的存在是因为……

网络从来就不是真正为应用程序设计的：¶

WWW 的设计目的是让任何人都可以浏览信息。应用程序是您下载并安装在个人计算机上的东西。但在我们意识到这一点之前，人们通过在此处添加一些 JQuery 或在那里添加一些 PHP 来向网站添加越来越多的功能。不知不觉中，网站和网络应用程序之间的界限就变得模糊了。

虽然数据存储技术的变化相当缓慢，但正如您所见，使用 Javascript 甚至 CSS 进行开发的最佳方式发生了很大变化。

在创造大量技术的狂热中，对强大软件开发的需求被抛在了后面。但有些人看到了其中的陷阱，并开始研究替代解决方案，使软件开发人员能够使用一种语言进行开发，同时生成 Web 应用程序所需的多种语言。在 Java 中，我们看到了zk和Vaadin。在 Scala 中，我们看到了令人兴奋的 ScalaJS实时编码，在 Smalltalk 中我们看到了Seaside。

但最令人印象深刻的是，我们看到了UrWeb———一种受 ML 启发的元语言，它生成类型安全的后端和前端代码，从而防止现代 Web 开发遇到的所有问题：

代码注入攻击
无效的 HTML
应用程序内无效链接
HTML 表单与其处理程序期望的字段之间不匹配
对远程 Web 服务器提供的 AJAX 样式服务作出错误假设的客户端代码
无效的 SQL 查询
与 SQL 数据库或浏览器和 Web 服务器之间的通信中的不正确编组或解组

因此我们明白为什么纯 Python Web 开发是必要的：¶

安全
易于开发
学习一种语言，而不是 3 种或更多快速变化的语言

NOJS Web 开发的 Python 方法概述¶

我们将其称为”NOJS”Web 开发，因为正如Qooxdoo所示，使用 Javascript，您可以生成和操作 CSS 和 HTML。所以 JS 是根，其他一切都从那里生长。

我该如何避免使用 JavaScript？让我来计算一下…¶

Python 领域有 3 种主要类型的产品，可让您使用 Python 进行开发，同时交付现代动态的全功能 Web 应用程序：

转译器– 这些产品主要涉及将 Python 直译为 JSS/CSS/HTML/Web 程序集。
应用程序套件- 这些产品旨在消除部署工业强度应用程序的大部分或全部问题。
构建器介于转译器和应用程序套件之间。在大多数情况下，构建器（或转译器）与传统的终端服务器 Web 应用程序框架（如 Flask 或 Django）一起使用。但是，正如 Dash 用户过去所经历的那样，将构建器输出集成到全套 Web 应用程序中可能会遇到相当大的痛苦，但随着 django-plotly-dash的推出，这对于 Dash 来说不再是问题。**

实用指南¶

实用指南分为”类”。在许多情况下，B 类解决方案与 A 类解决方案一样好。A 类解决方案是针对您可能需要在世界级 Web 应用程序中处理的任何功能的完整解决方案，为数千甚至数百万用户提供数十万次点击。B 类解决方案解决特定问题并做得很好。

最近 Reddit Python 上有一篇文章，其中一个人需要一个简单的 UI 来上传文件，然后运行一个进程。我推荐了 B 类解决方案Gradio，他用几行 Python 就创建了一个漂亮的应用程序，满足了他和他的教授的需求。

所以A类和B类是很好的解决方案。C 类和 D 类在某些方面有所欠缺，但仍可能有一些用处。

A 类系统的要求¶

它可以直接或通过与另一个功能齐全的框架轻松集成而功能齐全。这些要求已经到位，这样人们就不会因为无法扩展以适应不断变化的需求的闪亮的短期解决方案而感到困惑。Streamlit、Gradio 等非常适合单用户 Web 应用程序，但它们并没有提供演进为成熟的工业强度 Web 应用程序的途径。简而言之：除非产品可以直接或通过轻松集成完成Miguel Grinberg 的 Flask Mega 教程中的所有内容，否则它的功能并不完整。
维护良好———任何超过 1 年没有源代码更新的东西都不能被认为是维护良好的。如果存在严重的未决问题和拉取请求，这也会考虑在内。
文档齐全———理想情况下，所有主要形式的文档都存在———常见问题解答、教程、指南和参考。
良好的支持渠道———快速准确地响应社区问题是必须的。
（新的软标准）它必须能够扩展以每秒处理 100 万个请求或更多。在您的个人 Macbook pro 上运行可爱的小玩具应用程序固然不错，但世界排名前 100 的网络资产对无缝处理大量流量的要求要高得多。如果 Web 解决方案无法生成像 amazon.com 这样的网站并像 amazon.com 一样处理 Web 流量，那么为当地理发师构建玩具应用程序可能还可以，但它永远无法在要求严格的工业环境中在顶级水平生存。

A级：工业强度坚如磐石的产品¶

在本节中，我们列出了正在解决实际问题并准备好进行生产部署的产品……只需下载、安装并按照说明操作即可立即为您的问题找到解决方案，因为数百个其他产品已经做了同样的事情。

anvil（译者：第一位是软广告，可跳过）¶

http://anvil.works是基于云 Web 环境中提供的所有 Web 开发的抽象。它是一款免费增值产品。

reddit上有人真的很喜欢Anvil：

对我来说，最终的选择是关于生产力。Anvil 并不是一个”生成 HTML 和 JS”的孤立工具。它是一个集成套件，包含构建和部署完整的全栈软件项目所需的所有工具，使用纯 Python：数据库和可视化 UI 构建器、服务器和客户端功能，以及基本功能（用户管理、电子邮件、Web API、PDF 打印）、Git 集成和版本管理、Google 服务集成等）全部内置。Anvil 的整体设计、API 范围、部署功能以及它汇集的所有功能（远远超出 HTML、 CSS 和 JS 生成），再加上原生可用的完整 Python 生态系统所支持的广泛功能，这使得它具有极高的生产力，与我见过的其他系统（编写代码 40 多年）不同。

建立在skulpt[雕塑]之上¶

Anvil 在底层使用了 skulpt。

参考文章-刊物¶

“将 Jupyter Notebook 变成 Web 应用程序“

实例走廊(Demo Gallery)¶

“每天制作 YC 初创公司原型 – Meter Feeder（YC 冬季 16） “

YC 原型 #2：在 2.4 小时内构建魔法

Panel¶

Panel是令人印象深刻的工具堆栈的一部分。它专注于使可视化变得简单而强大。

基于Bokeh构建¶

实例走廊(Demo Gallery)¶

awesome panel

Dash¶

Dash有几个引人注目的要点：

人们可以构建真正的交互式分析应用程序，而不是被动的仪表板：应用程序可以具有表单和按钮来接收输入并实时更新图形仪表板。
适用于桌面和移动设备，并且可以按需生成可打印的 PDF：有 2 个（相互竞争的？）响应式 UI 开发标准：dash mantine 和 dash bootstrap。
有dash和dash企业版。企业版还具有其他高级功能，例如允许最终用户运行 GPU 加速工作流程以异步处理数亿条记录。

¶

基于plotly 和ReactJS 构建¶

资源¶

Ann Marie Ward 拥有 30 多个包含初级和高级 Dash 材料的存储库。她是《破折号之书》的合著者。几个亮点：

多页面应用程序示例– 现代 Dash 已经超越了单页面应用程序。

django-plotly-dash – 将 plotly dash 应用程序公开为 Django 标签。然后，多个 Dash 应用程序可以嵌入到单个网页中，保留并共享内部状态，并且还可以访问当前用户和会话变量。

讨论和出版物¶

“Pip 安装 Plotly-Dash | 在框架内学习/构建仪表板的十大有用资源”———强烈推荐视频和 YouTube 频道。

“Dash 仪表板，使用Python 和 React 教程进行多页面快速开发”

https://link.medium.com/GtsQEdqt7eb

“dash快速介绍“

” Dash 是 Python、R 和 Julia 的 React “

应用领域¶

“在我看来，Plotly/Dash 是前端开发的最佳框架“

应用程序库

从C级到A级¶

本指南的目标是对那些使简单的 Web 工作变得简单并允许您在必要时扩展以开发下一个前 100 名 Web 资产的框架进行评级。等级分级系统的设置是为了确保只有高度可靠、稳健且功能齐全的产品才能被评为 A 级。dash曾一度接近 C 级，因为我的研究显示，一位前用户表示：

如果这是一个简单的项目，当然可以。

不然就太可怕了。我们从 dash 切换到 fastapi + React。从此无怨无悔。

无名之人\

但最近在 reddit 上发表的一篇文章表明，Dash 可以做到这一切———简单的事情、Jupyter 的事情，是的，还有前 100 个网络财产的事情。

NiceGUI¶

NiceGUI有一个非常干净且文档齐全的 API，作者在其之上构建了很好的可交付成果，例如rosys。

一位贡献者为我们提供了 NiceGUI 当前内部工作原理的概览：

NiceGUI 启动一个后端 Web 服务器（运行 FastAPI），然后在指定的路由上提供 html、css 和 javascript。当浏览器请求页面时，前端代码会使用唯一的客户端 ID 与后端建立 Websocket 连接。当用户按下按钮时，事件会通过 websocket 发送到后端。然后后端执行注册的 Python 代码并通过 websocket 发回任何 UI 更新。

虽然很简短，但我希望它能让您对内部结构有一个基本的了解。如果您想了解更多详细信息，请向我提出后续问题。 :::

“感谢 Streamlit”¶

Streamlit 在 B 类领域获得了广泛采用，但我们对 Streamlit 进行了重新审视

在状态处理方面它发挥了太多的魔力。

NiceGUI 作者在这里更深入地探讨了 Streamlit 的缺点。

¶

基于 FastAPI 构建¶

NiceGUI 的作者出于某些特定原因选择了 FastAPI ，尽管我个人的研究会让我选择 Starlite。现在您可以在 NiceGUI 中编写功能齐全的 Web 应用程序。

不可链接的锚标签：¶

值得称赞的是，NiceGUI 网站是在 NiceGUI 本身中实现的。也就是说，NiceGUI 生成的锚标记没有属性name，因此您无法直接链接到 NiceGUI 生成的页面的某些部分。

实例走廊(Demo Gallery)¶

交互式图像 -讨论和演示链接

执行自定义 JS –讨论和演示链接

讨论¶

“NiceGUI：让任何浏览器成为Python 代码的前端“

NiceGUI 与 JustPy –内容丰富的讨论。

IDOM (已改名ReactPy)¶

https://github.com/idom-team/idom可能是典型的构建器库 - 它与 Flask、Django、FastAPI 和其他 4 个框架集成……并且相同的 IDOM 组件可以在所有这些框架中运行而无需修改。

IDOM 将您选择的 Python Web 框架连接到 ReactJS 前端，让您无需 JavaScript 即可创建交互式网站！

https://github.com/idom-team/idom

该项目的文档非常全面。他们有一个活跃的讨论区。并且git repo经常更新。绝对是一种引人注目的 A 类纯 Python Web 应用程序开发方法。

基于 ReactJS 构建¶

讨论¶

在本次讨论中，我们了解到 IDOM不会转换为 JavaScript。这使得纯组件函数能够完全兼容并移植到任何支持 websocket 的 Python Web 框架。

Epyk¶

Epyk与最常见的 Web Python 框架（即 Flask 和 Django）兼容。默认情况下，服务器包嵌入 Flask 应用程序，因为它更易于安装和使用。

它有很好的文档和一个很好的工作程序库

Flet¶

Flet允许您使用 Python 构建 Flutter 应用程序。这是一件大事，因为

Flutter 是 Google 的一个开源框架，用于从单个代码库构建漂亮的、本机编译的多平台应用程序。

我们在这里谈论的是真正的力量。它基本上是Htag的企业支持版本，这是具有类似功能的巨大的单一开发人员的努力。另一个类似的老产品是Muntjac ，它是 Vaadin到 Python的端口，不再受到积极支持。

讨论¶

Pynecone (已改名reflex)¶

Pynecone 编译为传统的 React（NextJS 风格）应用程序。包装 React 组件非常简单。作者过去曾使用过 Streamlit，并发现它非常适合上手，但对于更复杂的应用程序来说，发现它在组件、样式和性能方面存在限制。在 Pynecone 中，前端编译为 NextJS 应用程序，因此您可以完全自定义应用程序的外观。Streamlit 在某些情况下也可能很慢，因为它会根据用户事件重新运行整个脚本，而在 Pynecone 中仅传输状态增量。对于性能和 SEO 来说，nextjs 也很棒。

可扩展性随手可得！¶

Pynecone 具有出色的可扩展性：您可以水平扩展服务器并将其连接到 Redis 实例，以便它们可以访问用户状态。作者在后台使用 FastAPI 作为他们的 Python 服务器来处理前端事件并发送回状态增量。

此外，在生产模式下运行 Pynecone 应用程序时，您可以使用 NextJS SSG 将整个前端预渲染为 html。

参考链接¶

实例走廊(Demo Gallery)¶

https://pynecone.io/docs/gallery

讨论¶

Lona¶

https://github.com/fscherf/lona支持Django 模型和Django auth 系统的使用。

为了考虑用 python 编写的大型 HTML 树，Lona 支持小部件来封装较小的树及其功能。这使得组件可以重复使用。

Lona 有一种异步方法，允许人们在一个函数和一个上下文中编写整个视图。作者认为这会导致代码更加简洁。

据作者介绍， Lona基于aiohttp，内部使用asyncio。Lona API 完全同步，使开发更加容易。相比之下，使用 asyncio，甚至可以在没有注意到的情况下阻塞整个服务的核心事件循环。因此，Lona 定义了一个类似于 asyncio 的 API，但可以与阻塞代码无缝集成。

讨论¶

Nagare [流]¶

Nagare获得了 A 级排名。它已经存在十多年了，是最早提供纯 Python 方法进行 Web 应用程序开发的框架之一。它非常完整，他们的咨询公司已经交付了几个令人印象深刻的大型应用程序。当我使用它向一家财富 500 强公司部署应用程序时，他们非常支持我。它在很大程度上是一件艺术品和创造力的作品。

话虽这么说，它只有简单的 JS 到 Python 的转换，主要限于链接/按钮的”onclick”事件。

它的灵感来自于Smalltalk 的 Seaside 框架。

它基于基于组件的面向对象而不是继承。

它并不是为了利用 Javascript 的所有功能来创建反应式、高度交互的应用程序。

话虽这么说，如果您的愿望是面向对象的 HTML 生成接口到背面的对象关系存储 (SQLAlchemy)，那么对于此目的来说，它是非常禅宗的。

它被归类为 A 类，因为它可以解决问题。它与 B 类接壤，因为它不能提供所有 javascript 功能。此外，《Nagare》的作者也没有兑现将麂融入《Nagare》的承诺。Muntjac 是一个 Python 程序，它将整个Vaadin小部件集引入 Python，从而打造出美观的专业 Web 应用程序。

Reahl¶

Reahl是另一个勉强维持 A 级评级的工具。该框架的主要优点是它拥有大量开箱即用的小部件，可用于完成成熟的 Web 应用程序。我在一个咨询项目中使用了它，并且不需要在它之外寻找任何东西。

作者非常聪明且反应灵敏。我鼓励您在选择它之前仔细研究它的 Web 应用程序开发方法。另请阅读讨论组和已关闭的问题。坦白说，我与开发商在某些选择上的看法并不一致。但总而言之，我对他们在我与 Reahl 合作的一个成功完成的企业项目中给予我的快速支持表示赞赏。虽然 Nagare 和 Reahl 都是面向对象的超成熟系统，但它们以截然不同的方式拥抱 OO Python。

B 类：某些项目完全可接受的构建块¶

在本节中，我们将看到实现良好、记录良好的 pure-python-web-dev 的出色方法。请注意，B 类包含许多工业级”构建器”和”转译器”，这意味着即使您不会在大多数领域直接使用它们，它们也是当前可行的 A 类解决方案的动力。例如，Anvil 是一个 A 类纯 python-web 框架。但如果没有 Skulpt（B 级产品），这一切都是不可能的。

Gradio¶

Gradio可以通过易于使用的用户界面包装几乎所有 Python 函数。该函数可以是从图像增强器到税收计算器的任何函数，但最常见的是预训练机器学习模型的预测函数。

Gradio 允许人们快速创建界面（从控制台或 Jupyter 笔记本或https://huggingface.co/spaces）并”launch()”它们。

但也可以自定义 UI 组件的外观和/或行为。

从我的角度来看，缺点是：

目前尚不清楚如何将 Gradio 的输出集成到成熟的网络应用程序中。
它仅提供基于密码的身份验证。
不支持授权

¶

Shiny for Python¶

Shiny for Python拥有干净的 API 和良好的文档。与许多 B 类解决方案一样，它缺乏完整 Web 应用程序的功能 – 身份验证、授权和会话。

Htag¶

Htag是一个非常强大且实现优雅的纯 python-web-dev 解决方案。这是一位多产、才华横溢、积极进取的作者提出的最新解决方案。他从之前的产品Gtag和Wyc中获得了很多经验。

之所以是B级，是因为它是建筑商。一个非常灵活和强大的构建器，能够在以下所有部署场景中运行：

对于 桌面应用程序 ：您可以使用 PyWebView 运行程序，它将在 pywebview 容器中运行 UI（或”ChromeApp 运行程序”，在本地 Chrome 应用程序模式下）。
对于 Web 应用程序 ：您可以使用 WebHTTP 运行程序，它将在 Web 服务器中运行 UI，并在客户端的浏览器中提供 UI。
对于 Android 应用程序 ：您可以使用 AndroidApp 运行程序，它将通过龙卷风网络服务器在 kiwi webview 中运行 UI，并且可以嵌入到 apk 中（菜谱）
对于 pyscript 应用程序 ：您可以使用 PyScript 运行程序，它将在客户端完全运行

事实上，任何可以渲染 html/js/css的显示门户，无论是浏览器、pywebview、android/apk 还是任何基于 cef 的东西，都只需要一个 htag 运行器，以便 htag 能够渲染到它。

正如作者所说：

是的……承诺就在这里： 它是一个 GUI 工具包，用于从单个代码库构建”漂亮”的移动、Web 和桌面应用程序。

https://github.com/manatlan/htag#readme

Demo演示¶

加载后，这是一个非常令人印象深刻且富有表现力的演示。

讨论¶

“使用 htag为桌面、网络或移动设备创建 **matplotlib** 应用程序“
“HTag：一款适用于 Android 的 IRL 移动应用程序：使用 py3 的 tricount 克隆…… “
HTag：一个新的 GUI 从单个代码库中获取了适用于 Web/桌面/Android 的 pyscript 的第一个前端库;-)”
“htag 0.4.7（一个 gui/前端库，在 pyscript 中运行良好）”

Neutron [中子]¶

Neutron允许开发人员构建原生 Python 应用程序以及用于前端设计的 CSS 和 HTML。基于 pywebview 的本机 GUI 窗口和 JavaScript-Python 通信。

Vue.Py¶

Vue.py包装了 Vue.js。Vue.py 基于 Brython，作者很清楚目前存在哪些限制。缺乏应用程序库和较小的用户群导致这是 B 类解决方案。

JustPy – 另一个 Vue.js 包装器¶

https://justpy.io/

Justpy让开发者不再关心前端和后端开发的区别。来自[自述文件]（https://github.com/elimintz/justpy）：

JustPy 的后端是使用以下内容构建的：

starlette – “一个轻量级的ASGI框架/工具包，非常适合构建高性能异步服务”。
uvicorn – “一个快如闪电的ASGI服务器，基于uvloop和httptools构建”。

JustPy 的前端（对 JustPy 开发人员来说是透明的）是使用以下方式构建的：

Vue.js – “渐进式 JavaScript 框架”

JustPy消除前后端区别的方式是拦截前端的相关事件并将其发送到后端进行处理。

对于基于明显成熟度的 Vue 解决方案，我认为 JustPy 优于 Vue.py。但两者都没有为完全成熟的 Web 应用程序框架的常见问题提供解决方案。

最近的 Reddit 帖子显示了原作者对该项目的长期支持的承诺。话虽如此，作者缺乏回应确实导致了基于 Svelte而不是 Vue.js 的JustPy 的重大分叉。

构建 NiceGUI¶

JustPy 是 NiceGUI 的底层库。

出版物：¶

” justpy 开源社区正在成长“

pyfyre¶

我抄录了官方Github：

基于组件的框架。有使用其他前端框架经验的开发人员在使用 PyFyre 时应该会感到很自在。
真正的反应式。PyFyre 的虚拟 DOM 允许简单高效的状态管理。
快速导航。PyFyre 的单页面应用程序设计使页面之间的导航非常快捷。
具有静态类型的 Pythonic 代码。凭借其类型提示和 Pythonic 编码风格，使用 PyFyre 进行开发要容易得多。
异步编程。开箱即用地运行非阻塞函数。
CPython 互操作性。开发人员只能在客户端 Web 上有限地使用 CPython 包。
JavaScript 互操作性。允许开发人员利用 NPM 包并与现有 JavaScript 应用程序集成。
纯Python。无需接触 HTML 和 JavaScript 等其他语言即可构建 Web 应用程序。
和更多！

讨论¶

用于构建网站的Python 前端框架

基于 Brython 构建¶

Transcrypt¶

http://transcrypt.org/是一个 Javascript 生成器，它选择与 Javascript 库而不是 Python 库集成。React to Python一书演示了如何使用 Transcrypt 作为成熟应用程序的基础。应用程序示例库令人印象深刻。我个人的挑剔是，他们试图在 Transcrypt 中提供一些 numpy，这违背了他们利用 Javascript 生态系统而不是 Python 的理念。Web 应用程序中明确的职责分离要求他们将 numpy 和相关库留给后端 API。

尽管如此，Transcrypt 是一个经过精心打磨的成熟产品，鼓励任何希望利用 Python 相对于 Javascript 的优势的人将其用作 Js/Css/HTML 的 DSL。

您绝不应该认为 CPython 的每个方面都可以在 Transcrypt 中使用：他们的文档告诉您不然：

请注意，Transcrypt 避免了无法在浏览器中执行的构造。这意味着 Transcrypt 和 CPython 处于不同的联盟。Transcrypt 使 Python 程序员能够将大量技能运用到浏览器中，但它绝不是 CPython 的替代品。两者应该被视为是互补的。

转transcrypt文档。

Zython¶

Zython是一个 WebAssembly 项目，其实现与 python-wasm 和 pyodide 完全不同，它们都基于 emscripten，因此存在zython 不受.

该项目的既定目标是”……创建核心 Python 和依赖包的 WebAssembly 构建，它既可以在 Node.js 命令行上运行，也可以在主要 Web 浏览器中运行（通过 npm 模块，您可以通过 webpack 包含这些模块）。 ”

我发现不幸的是，python-wasm这个项目中使用了包名称 `：看起来它会造成不必要的混乱。

讨论和文章¶

Bokeh¶

借助Bokeh，您可以创建由 JavaScript 驱动的可视化效果，而无需自己编写任何 JavaScript。还可以在 Django 或 Flask 等传统框架中使用 Bokeh 输出。

对我来说，最大的问题是：仅专注于抽象 javascript 可视化的解决方案有什么好处？Javascript 还可以用于其他用途吗？当我需要另一个解决方案来解决其他 Javascript 问题时，为什么我要选择这个？

答案在于holoviz 框架，它提供了对 Bokeh 等的编程访问。

pyodide (碘化物)¶

https://pyodide.org/en/stable/

Python 与科学堆栈，编译为 WebAssembly。

Pyodide 可用于您想要在 Web 浏览器中运行 Python 的任何环境。

Pyodide 通过 WebAssembly 将 Python 3.9 运行时以及 Python 科学堆栈（包括 NumPy、Pandas、Matplotlib、SciPy 和 scikit-learn）引入浏览器。目前有超过 75 个软件包可供选择。此外，还可以从 PyPi 安装纯 Python 轮子。

Pyodide 提供 Javascript 和 Python 之间对象的透明转换。在浏览器中使用时，Python 可以完全访问 Web API。

构建块¶

这是 PyScript 的构建基础。

文章¶

https://testdriven.io/blog/python-web assembly/

接触¶

https://pyodide.org/en/stable/project/about.html#communication

PyWebIO¶

https://pywebio.readthedocs.io/en/latest/是一个构建器，具有 Tornado、Flask、Django 和 aiohttp 集成记录。它也可以独立执行。它是令人惊讶的程序化，但为使用函数而不是对象和方法的嵌套渲染提供了良好的支持。

示例代码¶

东京奥运会国家成绩排名

Skulpt and Brython¶

都是浏览器内的 Python 实现。但他们有不同的目标以及优势和劣势。布莱森速度更快。然而 Skulpt 需要较慢的执行和加载时间，因为它的目标是完全符合 Python 标准。产品的目标不同：Brython 的目标是成为 Javascript 的替代品，而 Skulpt 的目标是成为具有 Web 浏览器执行目标的 Python 发行版。

我在这个网站以及这个网站上找到了一个很好的图表。我不知道谁抄袭了谁，但该表确实很好地概述了各种低级解决方案；

{.wp-image-105 decoding=”async” width=”590” height=”337” srcset=”https://www.may69.com/wp-content/uploads/2022/07/image-20-1024x586.png 1024w, https://www.may69.com/wp-content/uploads/2022/07/image-20-300x172.png 300w, https://www.may69.com/wp-content/uploads/2022/07/image-20-768x440.png 768w, https://www.may69.com/wp-content/uploads/2022/07/image-20.png 1506w” sizes=”(max-width: 590px) 100vw, 590px”}

- https://www.reddit.com/r/Python/comments/2yli88/whats_the_best_implementation_of_a_python/¶

skulpt (雕塑)¶

https://skulpt.org/

构建模块……¶

Skulpt 是Anvil 的基础，它是 A 类纯 python-web-dev 解决方案的基础。

PyWeb3D¶

PyWeb3D允许您使用 Three.js 库而无需编写 JavaScript。正如我在 Bokeh 评论中所说，人们想知道当需要抽象 Javascript/HTML/CSS 的其他方面时该怎么做。

建立在：brypthon¶

文章和应用¶

“认识 PyWeb3D — Three.js 与 Python 语法“

brypthon¶

https://brython.info/

Reacton – 用于 ipywidgets 的 React 纯 Python 端口¶

ipywidgets 是一个用于在 Jupyter Notebook 中编写交互式小部件的库。

Reacton是一个纯 Python 库，它实现了与 ReactJS 类似的 API。它不是渲染到 DOM，而是渲染到 ipywidgets。然后 ipywidget 库负责前端渲染（可以使用 ReactJS、Vue 甚至 jQuery）。

讨论¶

最初的 reddit 线程。
“使用 Reacton 推进您的 ipywidget 应用程序开发— React 的纯 Python 端口，可加快开发速度”

streamlit (流线型)¶

https://streamlit.io/非常强大且非常受欢迎，但是在成熟的 Web 应用程序中添加您期望的功能是困难的、黑客的或混乱的，具体取决于您与谁交谈。然而，显然他们已经被 Snowlake 收购，因此他们的前进有强大的后盾。

实例走廊(Demo Gallery)¶

“制作了一款 Streamlit 应用程序，以显示美国 100 个最大都市区按年龄、种族、性别和教育程度划分的人口统计数据。”

” Streamlit 机器学习备忘单“

“如何使用 Python 和 Streamlit 构建股息投资仪表板“

” NFT 和元数据生成器 – Python 和 Streamlit “

“我为 OpenAI 的 Whisper 创建了 Streamlit UI，并添加了一些用于转录摘要的基本脚手架“

gallery

“使用 Streamlit 轻松监控 dbt Cloud 作业”

“使用 Streamlit 绘制 NL 直播中的所有公共交通图“

讨论¶

https://www.reddit.com/r/Python/comments/lnu1r9/i_made_a_covid19_immunityvaccination_tracker_and/

文章¶

“新的 Streamlit 教程，68 页，35 个最小应用程序示例，专注于 SQL+Streamlit”

“使用 Streamlit 和 Prisma 快速构建实时数据应用程序“

https://analyticsindiamag.com/streamlit-vs-plotlydash-comparison-with-python-examples/

“我对 YOLOv7 感到很兴奋，因此我使用 VDP 和 Streamlit 构建了一个可共享的对象检测应用程序。“

“使用 Auth0 Next.js SDK 简化用户和 API 身份验证’

¶

C 类：具有严重限制的解决方案¶

本节涵盖范围有限的产品

enaml web¶

Enamel Web是一个非常广泛的生态系统的一部分：

有一个简单的旧式Enaml，它可以使用 python 支持的 DSL 简洁地构建桌面应用程序
Enaml-web是Enaml for the web 的变体
有atom-db，这是他们的异步ORM
还有 Atom，它是 Python 的一个非常强大的对象系统。他们的对象系统有观察者和数据验证。它几乎与 Traitlets 一样好，Traitlets 稍微强大一些，因为您可以轻松地从 Traitlets 类生成命令行界面。

Enamel-web 有几个演示项目。为什么是C级？

您可以使用更简单的工具和更少的代码来完成简单的事情
没有路线图或设施来构建复杂的世界级网络应用程序
用户基数显然很小
开发者基数显然很小
值得一提的是，代码经常更新
现实世界中的例子很少。只是两个示例项目

¶

PyScript¶

PyScript由 Anaconda 开发。从表面上看，也只是从表面上看，PyScript 似乎就像 Brython———你将 Python 嵌入到 HTML 和 walla 的一些标签中，动态网页使用 Python 而不是 Javascript。

但 PyScript 与 Brython 的区别在于它基于 Pyodide。用合著者的话说：

Pyodide 与您在笔记本电脑上运行的 *CPython* 解释器相同，但编译为目标 WebAssembly。（就像 CPython 被编译为针对笔记本电脑上的 x86 或 M1 程序集一样。）

这就是为什么 Python 的各种本机 C/C++ 扩展也可以得到支持：它们也被编译为针对 WebAssembly。

这与 JavaScript 无关。当然不是”Pyodide 是用 JS 编写的 Python”———这更像是 Brython。（这种方法永远无法导入 numpy、pandas、scipy 等，而不用 Javascript 重写所有这些。）

Anaconda 首席执行官 Peter Wang

既然Anaconda已经开发了Panel，那么有人会想为什么要使用PyScript。王指出：

这是比 Panel 更广泛、更基本的功能。您可以在浏览器中运行几乎任何Python。您还可以包装 Javascript 库。因此，我们有一些示例展示了与 Three.JS、d3 等的交互。

根据 Wang 的说法，PyScript 的意图是：

…为数百万发现现有内容过于复杂的人提供编程能力。即使学习单一语言也够难的了。这些人将无法学习 JS、现代 Web 开发和 DevOps 等的所有复杂性。

使用 PyScript，他们只需使用单一语言编写，并带有一点 HTML，并且可以与任何朋友和同事共享一些东西，并且部署复杂性为零。他们可以通过电子邮件将文件发送给他们，或将其复制到拇指驱动器上。

Anaconda 首席执行官 Peter Wang

目前，人们对 PyScript 的兴趣远远超出了它为潜在用户提供高效解决方案的能力。然而，该产品强大的企业支持和庞大的开发团队表明，它很可能在明年左右成为 A 级系统。它具有巨大的潜力。正如htag的作者所说：

这是我多年来见过的最不可思议的事情……在 JavaScript 和 Python 世界中

它可以打开/解锁很多东西……

来自 brython，它以正确的方式解锁了完整的 python（感谢 wasm）

当然，在虚拟机浏览器能够原生支持它之前，还有很多改进/差距……但这就是要走的路……

但承诺就在这里……您可以编写 python 代码（并 pip 任何您想要的库），只需包含 js……现在！无法想象即将发生的所有事情……非常兴奋！

马纳特兰

问答¶

JS 和 Python 之间可以传递对象吗？¶

支持传递对象。在 OpenAI API 示例中，您将看到 js -> py：

from js import localStorage, document, console, XMLHttpRequest

” from js import… “将js对象直接导入到PyScript的Python中。

朝另一个方向（py -> js）走，你可以使用 PyScript.runtime.globals.get('my_variable_name')

XMLHttpRequest 这是我用来发出 HTTP 请求的方法， requests 因为 不受支持 。另一种选择是使用 pyodide.http.pyfetch

参考：

https://docs.pyscript.net/latest/guides/passing-objects.html

https://docs.pyscript.net/latest/guides/http-requests.html

基于 pyodide 构建¶

UiDOm¶

UIdom 官方仓库

建立在dominate(主宰)之上¶

Gooey¶

我抄袭：

Gooey 将您的控制台应用程序转换为最终用户友好的 GUI 应用程序。它可以让您专注于以熟悉的方式构建健壮、可配置的程序，而无需担心如何将其呈现给普通用户并与之交互。

为什么？¶

因为尽管我们非常喜欢命令提示符，但世界其他地方却将它视为 80 年代初的丑陋遗物。最重要的是，程序通常需要做的不仅仅是一件事，这意味着提供选项，这以前意味着要么构建 GUI，要么尝试解释如何向控制台应用程序提供参数。Gooey 的诞生就是为了（希望）解决这些问题。它使程序易于使用，而且美观！

这是给谁的？¶

如果您正在为自己、其他程序员构建实用程序，或者生成您想要捕获的结果并将其传输到另一个控制台应用程序的东西（例如 *nix Philosophy utils），那么 Gooey 可能不适合您。然而，如果您正在构建”运行并完成”、围绕办公室风格的脚本、将比特从 A 点铲到 B 点的东西，或者只是针对非程序员的东西，Gooey 是完美的工具工作。它可以让您随心所欲地构建复杂的应用程序，同时免费获得 GUI 端。

Wooey¶

根据Wooey 文档：

Wooey 是一个简单的 Web 界面，用于运行命令行 Python 脚本。将其视为将脚本发布到网络上以进行常规数据分析、文件处理或其他任何操作的简单方法。

remi¶

remi放在 C 组让我很伤心。作者在他的产品上非常努力并且非常敏感。

它提供了一种基于类的用户界面生成方法。它使用内部网络服务器运行，对传统身份验证和授权的支持有限。

它主要擅长构建供个人使用的用户界面。它比 Gradio 更古老。

Abstracloud¶

Abstracloud让我想起了 Gradio，但有商业限制。定价模型和非自由和开源软件的分发方法似乎有点限制。例如，将他们的定价模型与Anvil 的定价模型进行比较，我们发现 Anvil 的免费帐户中可以有 50,000 个数据表行，而任何存储都需要跳转到付费计划。

刊物¶

- https://www.reddit.com/r/Python/comments/wg13qr/lib_that_generates_web_uis_for_your_scripts_they/¶

可交付成果¶

https://www.reddit.com/r/Python/comments/wg4ml7/i_made_a_simple_weight_tracker_that_displays/

RapydScript¶

https://github.com/atsepkov/RapydScript是一个 C 类系统，主要是因为它不是 Python，也不是 Javascript。他们确实有一组令人印象深刻的图库示例，但自 2021 年 5 月以来，邮件列表和源代码就没有任何活动。当一个人尝试创建一种新语言时，必须首先拥有用户和库，如果其中任何一个出现任何消耗，随着时间的推移，这种语言就会变得不那么受欢迎。我们已经在 Coffeescript 、Cappucino 和 Objective-J中看到过这种情况。诚然，Python 有缺点，Javascript 有更多缺点，但我曾经看到一次 IRC 聊天，有人在争论用 Common Lisp 重写 Emacs，而另一个人说：”你的意见无法替代数百万行工作代码” 。换句话说，如果没有库和用户群，完美的语言就毫无意义。

Rapydscript-ng – RapydScript 的一个分支¶

https://github.com/kovidgoyal/rapydscript-ng是 Rapydscript ng 的一个分支。自 2021 年 12 月以来，一直没有对该回购协议进行任何承诺。分叉一种语言来创建另一种变体意味着 rapydscript-ng 与 Rapydscript itelf 具有相同的采用风险

Ryact 和 Breact¶

Ryact 和 Breact 是 React 的模拟。Ryact 基于 rapydscript 构建，比基于 Brython 构建的 Breact 快 10 倍。作为一名作者，他无法满足其项目中工业级软件工程的所有需求。

基于 rapydscript 和 Brython 构建¶

WASMer for Python：Pyodide 的弟弟？¶

https://github.com/wasmerio/wasmer-python – 是 Python 的 WebAssembly 运行时。作为构建者，它似乎不如 Pyodide 受欢迎。此外，开发团队和用户群似乎更小。

¶

Domonic¶

Domonic也是一名建筑商。它包含相当多的子包，其中一些在其他地方可能会更好：

html : 用 python 3 生成 html ????
dom：python 3 中的 DOM API ????
javascript：python 3 中的 js API ????
终端|| cmd ：使用 python3 调用终端命令？？？（见最后）
JSON：用于加载/装饰/转换的实用程序
SVG：使用 python 生成 svg
框架|| x3d 标签：使用 aframe 自动生成 3d 世界。

作者还有一个名为 htmlx 的精简包，将在仅 HTML 部分中讨论。

为什么多莫尼克的评价这么低？¶

嗯，文档和源代码存储库都是最新的，所以这不可能是原因。基本上，这是一个未完成的项目，可交付成果很少。例如，在有关 d3 接口的文档中，他声明”警告：此包仍在开发中”。期待错误 ‘。纯 Python Web 开发的方法似乎比其他项目不太优雅。例如，需要手动包装 d3，然后对其进行不完整的工作，这表明该项目比 Transcrypt 限制得多，Transcrypt 可以使用任何 Javascript 库而无需任何特定的包装。

作者还开发了 htmlx，它是 domonic 的精简版本，主要限于渲染 HTML。

Wave¶

https://h2oai.github.io/wave/擅长构建实时流式仪表板。它支持 OpenID 和 Basic Auth，但没有示例，也没有表达与 Flask 或 Django 集成的担忧，尽管他们认为它可能应该有效。

我安装了 Wave 并进行了巡演。我在使某些示例在 Windows 上运行时遇到问题。即便如此，我发现 Wave 非常简洁且非常强大。

它是模块化和动态的。我所说的模块化，是指构建网站就像用对象填充 Python 数据结构一样简单。我所说的动态是指直接从 Python REPL 编辑实时网站的能力给我留下了深刻的印象。试想一下：实时站点可以通过 cron 作业进行更新。

我有点犹豫，因为必须学习两种不同的使用 Wave 的方法：一种用于脚本，一种用于应用程序。为了让事情变得简单，我总是会编写应用程序。此外，本教程最好有 2 个目录———一个用于脚本，一个用于应用程序，而不是将所有 Python 示例都放在一个应用程序目录中。

我也不喜欢在渲染方法中初始化模型的方式。我开始对此进行讨论。

D 类：停产产品¶

本节跟踪不再维护的产品，并且可能无法解决现代 Web 应用程序开发问题。

Dashborg¶

将 Dashborg 归类为已不复存在可能有点苛刻。但是 slack 邀请链接不起作用，并且存储库没有最近的提交。事实上，主要的 dashborg 产品不是 FOSS，只有后端 SDK 才是。用户群似乎很小，并且没有记录的实际用例。

https://www.dashborg.net/是独一无二的。您可以将其称为解决Angular 噩梦的更明智的方法。它允许人们创建完整的应用程序，但使用”实时”版本的 HTML，使用 Go 或 Python 后端动态自填充。

这很有趣，但它的工作方式与我的想法相反：我宁愿让计算机程序生成 HTML/JS/CSS，也不愿让我的图灵完备语言受到我可以粘贴到 HTML 中的内容的限制。

所以我想说，它不会像 Angular 那样让我感兴趣———功能较弱的语言正在协调使用功能更强大的语言。

过去类似的其他工具有 OpenLaszlo。目前流行的此类工具是HTMX。

Muntjac (麂)¶

Muntjac Vaadin for Python的实现。Vaadin 是一个企业级 Java Web 应用程序框架，具有大量现代干净的 JavaScript 小部件。

Vaadin 通过 Java 抽象出了 Javascript，而 Muntjac 以令人印象深刻的方式为 Python 做了同样的事情。

Timothy Crosley (蒂莫西·克罗斯利)产品¶

WeBot¶

https://github.com/timothycrosley/WebBot是的集合几个可以构建 Python Web 应用程序的工具与原生的构建方式相同。

因此，WebBot 框架鼓励重用，简洁的代码，快速的开发，快乐的开发者。

Jigna¶

Jigna 在EuroPython 2014 演讲中展示了巨大的前景。基于 Enthought Traits 并得到 Enthought 支持也是其优势所在。然而，源代码存储库已经三年没有任何行动，将其归入已失效类别。

jiphy¶

https://github.com/timothycrosley/jiphy是一个几乎已经失效的转译器。

DOM¶

https://github.com/timothycrosley/thedom用于生成 HTML 和 JS

anpylar¶

https://www.anpylar.com/自 2018 年以来一直没有更新。

PyJS（以前称为 PyJamas）¶

http://pyjs.org/曾经被称为睡衣，但现在这个名字已被保留用于完全不同的东西。

仅 HTML/CSS¶

快速 HTML
html 写
凌乱的汤
Htmlx是同一个人编写的名为domonic的较大软件包的精简版本。讨论。
https://github.com/BrainStormYourWayIn/sierra
佩里https://www.reddit.com/r/Python/comments/roaz0i/fancy_way_of_writing_websites_perry_library/
https://github.com/Knio/dominate
https://pypi.org/project/simple-html/

¶

笔记¶

React in Python - IDOM 与 Transcrypt（省略 Ryact 和 Breact）¶

IDOM 和 Transcrypt 都有纯粹在 Python 中使用 React 的解决方案。然而，由于 IDOM不会转换为 JavaScript，纯组件函数完全兼容并可移植到任何支持 websockets 的 Python Web 框架。

Pynecone¶

Pynecone 是一个新项目，它编译为 React 的 NextJS 风格，它有一个令人印象深刻的画廊。

Tangential产品¶

Reaction¶

感谢 Reacton，React 现在可以在 ipywidgets 中使用

py-react¶

py-react支持通过 Pyodide在浏览器中运行 Python 。话虽这么说，它似乎并不像其他浏览器中的 python 产品（ skulpt、brython、pyscript ）那样渴望成为一个 Web 应用程序工具包。因此 py-react 列在切线部分。你可以在这里尝试一下。

该产品的讨论主题：

“使用react-py在浏览器中运行Python代码“

非Python的同类产品¶

UrWeb¶

UrWeb是一种单一的强类型语言，可以编译成可以发出 SQL 和 Javascript 的单一二进制文件。

Vaadin¶

Vaadin是一款基于 Java 的产品，具有大量小部件，它允许 Java 开发人员拥有所有交互性，而无需处理 Javascript 的麻烦。

HTMX¶

许多希望留在 Django/Flask 领域的人选择 HTMX来赋予他们 Javascript 的力量。

常见问题 (FAQ)¶

对哪些技术构建的app有令人深刻的印象？¶

Streamlit¶

gallery

“使用 Streamlit 轻松监控 dbt Cloud 作业” :::

K8S运维总结之关于Kubernetes项目最佳实践的思考

2021-12-14T23:46:00+08:00

Kubernetes [kubə’netis]简称K8S或Kube，平时使用K8S主力是Minikube，在几个项目生产实践中，则使用GCP/AWS/阿里云的对应的K8S实现，GKE/EKS/ACK。以下是作者在项目运维中获得和经反思提炼的知识总结，部分理解带有个人观点。

1、Kubernetes 基础概念¶

理解 Pods¶

Kubernetes 中最小计算单元，内含pause和一个或一组进程。深入pods技术细节见Kubernetes Pod 网络精髓：pause 容器详解。

理解网络¶

Kubernetes有2个网络地址池CIDR分别供Pod和Service。Service和Pod都是有IP的网络实体，会消耗ip池地址，且各IP互通(由CNI实现)。Pod还是个计算实体承载服务，Service则按一定规则转发流量到0个或多个pod。实现模型理解见浅聊 Kubernetes 网络模型

理解Service¶

Service本质就是dns解析+proxy转发，通过Service名:port方式就能访问真正的实体pod，类似非K8S生态的consul，但K8S内部服务名字的dns解析都是高度自动化的，无感知的。

有状态下pod漂移与vm漂移¶

ip在pod生命周期内不变，但pod会因销毁重建导致ip漂移。内存与未绑定文件在pod销毁期间就清空了。相比而言，vm漂移技术成熟，ip内存文件都是一起在线飘到新地方，不存在重启销毁问题。

2、理解Kubernetes技术¶

1. 社区角度：¶

从2015年7月Kubernetes v1.0正式发布至今v1.22版本，基于Kubernetes的生态已经非常庞大，直接导致go的流行，运维云原生化趋势。

2. 工程师角度：¶

绝大部分编排k8s的中间产物都是yaml文件，所以k8s工程师被称为yaml工程师。但其实ansible/salt工程师才是最先全用yaml的。

3. 技术角度：¶

内核技术升级是上层技术革新的基础，当年nginx使用epoll网络IO模型率先实现10K并发，如今docker/Kube实际上是内核cgroup/namespace进程环境限制/隔离加内核netfilter网络模块的上层产物。——技术早已出现，只是换个地方而更被人熟知，这现象可称为【军用科技民用化】。

4. 运维效用角度：¶

自动化套件ansible/salt也是非常成熟的，另一方面非容器或非linux机的自动化集群管理并非k8s强项，k8s仅在支持容器化的项目上高效，而大部分项目可以容器化（0.9*0.9依然接近1，但不是全部）。

5. 基于作者理解：¶

k8s是“定义即状态”的运维实现，对应软件代码“定义即实现”具体指发展到IDL层面（接口描述语言）。
k8s内置电池，一个k8s集群相当于实现了一个跑在容器的逻辑机房（计算+网络+存储都是可扩展的），外加一个ansible/salt控制中心。
k8s本身学习难度大，非初学者友好，需要较深的linux内核/网络基本做底，但k8s生态的文章，精品率更高，反过来能加速学习容器化与linux相关知识的过程。

3、Kube入门学习建议¶

💡 理解上把容器对标物，从虚拟机转变到进程来。¶

容器是一个新概念，从字面上并不好理解其真本质：隔离
容器更像一个进程，而不是一个轻量的虚拟机。

💡 个人学习k8s路径选型¶

从单机上的容器(docker/containerd)出发，跳一步到单机的K8S(minikube)，再到多节点K8S(minikube)，再适应云商的改版K8S。
Ingress也有很多种，建议如果熟悉nginx，先从ingress-nginx入手。
服务治理Istio囊括范围非常大，k8s只是组件之一，容易找不着北。个人觉得不适合用来入门k8s。
官方dashboard已经很好，配合K9S工具已经够用了。一个管UI，一个管console。k9s真是vi党的福音。
lens也是好工具，管理国内集群无明显延迟感。国外可能会稍卡顿。

💡 容器 ≈ 进程+网络。¶

除了理解linux内核，也需要iptables/ipvs理解能力。
网络理解更难啃些，建议不要跳过docker网络直接理解k8s网络cni。

💡 使用docker-compose作为对照参考¶

对比中理解docker编排/k8s编排各自的长短处。会对k8s理解得更加全面和立体。
docker-compose也是一股容器编排方面的重要力量。有余力者学1得2。

💡 个人经验最佳学习搭档官方文档书籍 + minikube实践。¶

官方文档要重复看，坚持看，一般看第三遍就懂了。
minikube是官方首推的学习和测试k8s环境，只需单机docker环境即可启动一个完备的k8s集群，很轻量，最快支持最新k8s版本。
推荐第三方书的话《kubernetes网络权威指南》

4、Kube最佳实践，经验建议¶

💡 打包images兼容非K8S容器环境运行，更利运维部署，以及开发调试。【Projzz, Projxx】¶

Projzz的镜像兼容docker，并且cp内部某套集群就是用docker部署的，线上则全用K8S部署的。
Projxx的Pod启动是准备3-4个部分容器，最终合并到最终容器的emptyDir来running，如果选这种模式确实只能k8s了。

做一个通用的镜像，能独立运行。用好动态部分来让同一镜像变成不同的runtime容器，如volume挂载，配置，环境env变量都是动态的。

💡 相似微服务可以统一镜像，使用APP环境变量启动镜像的不同部分【Projyy】¶

相对于各微服务独立打包镜像的分包模式，还有一种简单的全包模式。

Projyy镜像都是java进程，启动脚本命令基本一样，只是目录和jar包不同，使用了轻量的全包模式。通过指定APP环境变量，启动对应微服务。兼容docker/k8s。

全包镜像模式好处：

统一的Dockerfile，entrypoint.sh不用维护多个文件。
减少镜像总占用空间，版本管理起来更轻量简洁。（harbor界面也简洁了）
更接近vm时代supervisor的管理整代码包的方式。更好理解。

💡 用ExternalName型和EndPoints型的服务进行Kube内部服务名固定。【Projxx】¶

用Service映射内部/外部服务简化架构:

组件依赖以服务SVC出现供微服务调用。Projxx依赖为zoo-svr, mysql-svr, redis-svr 与 zoo-svr-out, mysql-svr-out。

SVC底层的EndPoints/ExternalName映射各集群不同。如正式va集群是中心，微服务调用mysql-svr-out/mysql-svr-out底层相同，sg集群则不同。

如下图，屏蔽底层差异后，研发不用关心底层，mysql等服务的映射关系由运维定义和修改，容灾切换。

Projxx图解：

💡 在namespace级别隔离业务环境，而非集群级别隔离。¶

减少k8s集群，理想状态是一个测试集群(dev/qa/pre/time/audit服)+一个正式集群。【Projyy】

为了让单集群支持多环境，需要以下条件：

yaml/chart中不写死namespace，使用kubectl -n 和 helm -n 在运行时指定namespace。
节点映射到pod中的目录或文件名，需要保证不同namespace间不不一样。注意hostpaht和local映射。
ingress域名不能在多namespace里共用，不同namespace用不同域名。（一般已经天然满足的）
daemonset组件处理好不同namespace里不同环境的情况。比如filebeat以daemonset部署时可以收集多namespace的日志。

💡 善用hostpath在pod层面实现节点的初始化，日志清理等，不建议ssh到node进行初始化。【Projzz】¶

将node的东西暴露给pod，就可以从pod层面处理好node的事项。以下推荐度逐渐递减

以crontab/job加hostpath挂载处理初始化，还能定时清理日志等。
以daemonset加hostpath挂载
使用initpod模式加hostpath挂载

💡 多用Deployment而不是多用StatefulSet【RO】¶

如无必要，Deployment好于StatefulSet，尤其在大副本数滚动更新时StatefulSet慢

默认情况，Deployments更新2批次完成，而StatefulSet逐个重启，虽然可优化，但不如Deployment快和便捷。
需要hostname/dns固定时间，启动顺序(如mysql主从集群)有要求时才特别的需要StatefulSet。
Ro的Account登陆校验，Bgame跨服，Global模块，用不到特殊情况，account更新比较慢，理论上改成Deployments会更优。

💡 其他建议：¶

kubectx/kubens实际上在交互shell时才比较好用图省敲键盘。在脚本或自动化流程中，多使用–kubeconfig和–context参数指定集群更好。
Fairy使用kustomize跑着也很稳，其求同存异的patch思路，也是很好的，免去helm那样写go模版。
pod/service/namespace的名字尽量精简，Linux内核的主机名字段限定了FQDN最多 64 个字符。
ingress尽量合并以减少总量，像gcp的gke就存在多于15个ingress是重载非常慢的问题。
珍惜两个cidr地址的使用，太大了网络ip使用量，即pods/svc太多，会导致集群内耗过多。这类比开发微服务太小散，会导致cpu内耗在(反)序列化中。某字节内部资料说有10%
尽量减少总容器量，比如微服务较多时，daemonset的filebeat部署，比inject/sidecar类型的部署模式省容器。
提升副本数不如提升配置，副本数20升级60，在业务代码支持情况下，不如保持20个，配置升3倍。
总的来说，本质上就是微服务不是越多越好，目前业界有种不良趋势，服务拆得太小。把服务越拆越细，这事本身也像一个技术界内卷行为。

5、Kube带来的问题反思¶

1. 云厂商各自实现部分，并不统一，造成割裂，在复杂(云)之上制造复杂(Kube)。¶

正例：¶

基于LB的证书解密实现，阿里云/AWS均是annotation注释指向某个cert证书对象的id。运维开发的效用在于屏蔽这些差异。参考【某_ingress_chart】代码。

反例：¶

基于LB的whiteiplist实现，阿里云 / AWS不同。annotation注释指向一块acl对象id / 使用spec中loadBalancerSourceRanges。兼容起来麻烦，也只能运维配置，最终可能还不如在游戏层实现【Projxx】

2. 产生大量不好识别的16进制名称的LB¶

LoadBalance型服务，产生的名字不规律。难识别。

3. ingress 与动静文件分离问题¶

使用nginx ingress也无法做到动静分离，只能将静态文件另外部署，如cdn，ingress后配nginx服等等。

How to setup ingress to serve static content on kubernetes? #323

面试算法编程选记2题之二分法-寻找斜率为K的2点

2020-06-22T00:00:00+08:00

因为一直是用自学+坚持自学方法走过来的，折腾技术运用还可以，基础算法编程能力一直偏弱。

1、二分法属于思维简单，细节弄人的典型。之前陷入过二分法脑风暴中不能通透，这次趁面试遇到好好再过一次，提高深度。

2、输入数组A 例如 [(x1,y1),(x2,y2)…]，输出斜率为K的点对数目

二分查找¶

二分查找要处理好中点，缩小方法，避免死循环。重在细节实现。 Plus增强后支持最左最右查找

已过 leetcode算法题：https://www.nowcoder.com/questionTerminal/28d5a9b7fc0b4a078c9a6d59830fb9b9

class BinarySearch:
    def getPos(self, A, n, val):
        a1, a2 = 0, n-1 # a1 = 0; a2 = n-1;
        while a1 <= a2:              # a1, a2 位置未检
            mid = (a1+a2)//2        # 中间索引赋值是关键，可等左，不等右
            # print(val, A, a1, a2, mid)
            if A[mid] == val:
                return mid
            elif A[mid] < val:
                # print(A, a1, a2, mid)
                a1 = mid + 1
                # print(A, a1, a2, mid)
            else:
                a2 = mid - 1
        else:
            return -1

    def getPosPlus(self, A, n, val, searchtype=0):
        '''支持最左，最右二分查找的修改Plus版本
        'left':-1, 'fast':0, 'right':1 其中0是默认版本，找到即返回。
        '''
        a1, a2 = 0, n-1
        while a1 < a2:              # 直到重合时，单元素
            mid = (a1+a2)//2        # 中间索引赋值是关键，可等左，不等右
            # print(val, A, a1, a2, mid)
            if A[mid] == val:
                if searchtype == 0:
                    return mid
                if searchtype == -1:
                    a2 = mid
                elif searchtype == 1:
                    a1 = mid
            elif A[mid] < val:
                # print(A, a1, a2, mid)
                a1 = mid
                if a1 + 1 == a2:   #  避免剩余2个元素时， mid=左陷入死循环
                    a1 = a2
                # print(A, a1, a2, mid)
            else:
                a2 = mid
        else:
            assert a1 == a2
            return a1 if A[a1] == val else -1


if __name__ == '__main__':
    rt = BinarySearch()
    for A in ((1,), (1,5), (1, 5, 9), (1, 1, 5), [4,4,10,21]):
        n = len(A)
        for val in A:
            # idx = rt.getPos(A, n, val)
            # print('find %3s in %10s: index=%s' % (val, A, idx))

            # 支持最左，最右二分查找的修改Plus版本
            idx = rt.getPosPlus(A, n, val)
            print('find %3s in %10s: index=%s' % (val, A, idx))
            idx = rt.getPosPlus(A, n, val, -1)
            print('find %3s in %10s: index=%s' % (val, A, idx))

寻找斜率为K的点对¶

算法题：

有一个数组,数组每个元素是一个对象,每个对象有x和y两个值,这个数组记录为A: A = [{x1, y1}, {x2, y2}, …];我们把数组A中任意两个满足以下关系的元素叫做“点对”:(y2-y1)/(x2-x1) = K, K是一个常数。编写程序:给定A与K,返回A中点对的数目。

from itertools import groupby

K = 1 # 斜率

def kpairs(A, k=K):
    '''
    分析：计算一遍点到直线y=kx距离 |Kx - y| / √(k*k+1)，距离等两点的可能与y=kx平行。先验证y=kx上的，距离等不一定平行。
    技巧：结合题目实际，可不开平方pow运算，不取绝对值。
    '''
    print('debug: kpairs(%s, %s)' % (k, A))
    result = 0
    distance = [ (k*x-y) / (k**2+1) for (x, y) in A ]
    point_distance = sorted(zip(A, distance), key=lambda x: x[1])  # 距离排序，取点

    for distance, pointiter in groupby(point_distance, key=lambda x: x[1]):
        points = list(x[0] for x in pointiter)
        count = len(points)
        print('debug: line:y=%3sx, got %3s point distance=%7.3s: %s' % (k, count, distance, points)) # debug
        if count > 1:
            result += count*(count-1)/2 # 组合数 4 -> 6

    return result

if __name__ == '__main__':
    A = [(0,3), (3,0), (3,3), (0,0)]  # 正方形
    assert kpairs(A) == 1, 'check and debug kpairs(%s)'%A
    assert kpairs(A, 10) == 0, 'check and debug kpairs(%s)'%A

    A = [(3,9), (9,9), (20,20), (10,16), (22,28)]
    assert kpairs(A) == 4, 'check and debug kpairs(%s)'%A
    assert kpairs(A, 4) == 1, 'check and debug kpairs(%s)'%A

参考¶

点到直线距离公式的几种推导 https://zhuanlan.zhihu.com/p/26307123

面试高频题-LRU缓存的python实现

2019-08-22T14:00:00+08:00

过程简略： url去重的方法，数据库四种隔离级别，乐观锁悲观锁，算法题研讨。算法讨论占了很长时间，以下是把这个过程沉淀后的一遍随笔。

leetcode算法题：146. LRU缓存机制¶

https://leetcode-cn.com/problems/lru-cache/

运用你所掌握的数据结构，设计和实现一个 LRU (最近最少使用) 缓存机制。它应该支持以下操作：获取数据 get 和写入数据 put 。

获取数据 get(key) - 如果密钥 (key) 存在于缓存中，则获取密钥的值（总是正数），否则返回 -1。

写入数据 put(key, value) - 如果密钥不存在，则写入其数据值。当缓存容量达到上限时，它应该在写入新数据之前删除最近最少使用的数据值，从而为新的数据值留出空间。

进阶:

你是否可以在 O(1) 时间复杂度内完成这两种操作？

示例:

LRUCache cache = new LRUCache( 2 /* 缓存容量 */ );

cache.put(1, 1);
cache.put(2, 2);
cache.get(1);       // 返回  1
cache.put(3, 3);    // 该操作会使得密钥 2 作废
cache.get(2);       // 返回 -1 (未找到)
cache.put(4, 4);    // 该操作会使得密钥 1 作废
cache.get(1);       // 返回 -1 (未找到)
cache.get(3);       // 返回  3
cache.get(4);       // 返回  4

思考过程简要¶

第一次遇到，没有做好题。之后总结思考如下。面试完重新整理好代码，才通过。

1、数据结构知识弱，链表随机增删复杂度O(1)，数组复杂度O(n)。使用按时间排序的双向链表。头部总是最新访问或插入的，尾巴总是最老的。使用额外maxsize限制大小，nowsize记录目前大小。

2、链表元素是key-val的进一步封装的Node类。链表是另一个类，类总head和tail表示头尾两个空的node。一直不删。

3、开头想到最小堆，用得不对。二分法等比较查找下限O(lgN)，与哈希法的O(1)差距意识不明显。而哈希函数用内置字典即可。

4、拆分小函数复用代码。比如get = 出链 + 插入头部， put = 出链 + 插入头部(update) 或者插入头部(非update)

5、之后发现python有functools.lru_cache的现成实现，值得学习。

leetcode通过提交的代码¶

class Node:
    def __init__(self, key=None, val=None):
        self.key = key
        self.val = val
        self.prev = None
        self.next = None

class LRUCache:
    '''
    小函数: 删node，入head
    注意：head和tail是空的node，不能删除
    '''
    def __init__(self, maxsize=10):
        self.maxsize = maxsize
        self.nowsize = 0
        self.head = Node()
        self.tail = Node()
        self.tail.prev = self.head
        self.head.next = self.tail
        # key -> nodes.val
        self.nodes = {}

    def get(self, key):
        node = self.nodes.get(key, None)
        if node != None:
            # 2019-08-21面试时加的要求
            self.popNode(node)
            self.addNode(node)
            return node.val
        else:
            return -1

    def put(self, key, val):
        self.set(key, val)

    def set(self, key, val):
        node = self.nodes.get(key, None)

        if node != None:
            # 在链表中，update操作
            self.popNode(node) #

        self.addNode(Node(key, val))

    def delete(self, key):
        node = self.nodes.get(key, None)

        if node != None:
            self.popNode(node)


    def popNode(self, node):
        if node.val == None:
            return

        # 使用head和tail为空node时无需检查
        # if node.next:
        #     node.next.prev = node.prev
        # else:
        #     self.tail = node.next
        # if node.prev:
        #     node.prev.next = node.next
        # else:
        #     self.head = node.next
        node.next.prev = node.prev
        node.prev.next = node.next

        self.nowsize -= 1

        # 字典更新
        del self.nodes[node.key]

        return node


    def addNode(self, node):
        # 总在链表头加入
        if node.val == None:
            return

        if self.nowsize >= self.maxsize:
            # 满了，就去掉尾巴再插入
            self.popNode(self.tail.prev)

        node.next = self.head.next
        node.prev = self.head
        self.head.next.prev = node
        self.head.next = node # 费时的debug错误：这句之后[['c', 12]] -> []

        self.nowsize += 1

        # 字典增加
        self.nodes[node.key] = node

    @property
    def vals(self): # debug
        # node = self.head # 错误：发现用时15分钟
        node = self.head.next
        _vals = []
        # while node.val: # 2019-08-21大坑，node.val = 0时会失败！费了1小时！！！
        while node != None and node.val != None:
            _vals.append([node.key,node.val])
            node = node.next
        return _vals

    def pprint(self): # debug
        print(self.vals, flush=True)

if __name__ == '__main__':
    lru = LRUCache(3)
    lru.set('b', 12)
    lru.pprint()
    print('stage end: -----------------')
    lru.set('a', 12)
    lru.set('d', 12)
    lru.set('c', 12)
    lru.pprint()
    print('stage end: -----------------')
    print(lru.get('a'))
    print('stage end: -----------------')
    lru.delete('a')
    lru.pprint()
    print('stage end: -----------------')
    lru.set('d', 0)
    lru.pprint()
    print('stage end: -----------------')


    # leetcode的测试用例
    cache = LRUCache(2)
    cache.put(1, 1);
    cache.put(2, 2);
    cache.get(1);       # 返回  1
    cache.pprint()
    cache.put(3, 3);    # 该操作会使得密钥 2 作废
    cache.pprint()
    cache.get(2);       # 返回 -1 (未找到)
    cache.pprint()
    cache.put(4, 4);    # 该操作会使得密钥 1 作废
    cache.get(1);       # 返回 -1 (未找到)
    cache.pprint()
    cache.get(3);       # 返回  3
    cache.get(4);       # 返回  4

参考¶

leetcode算法题：146. LRU缓存机制 https://leetcode-cn.com/problems/lru-cache/
Python 缓存机制与 functools.lru_cache http://blog.konghy.cn/2016/04/20/python-cache/

Linux服务器安装轻量X环境xfce桌面和VNC服务

2019-04-27T21:00:00+08:00

有些任务需要Linux桌面环境，例如使用chrome/firefox浏览器进行测试或抓取数据。简要记录安装过程备需。任何时候，一个免key的SSH登录环境都能带来方便。

以下环境是Ubuntu18.04， Ubuntu其他版本大同小异。其他linux发行版需修改。

安装必须的xfce桌面基础包。还有语言支持包¶

桌面环境我选xfce。足够轻量体验也很好。vnc服务器我选tightvncserver，简单高效。

# X环境，设置中文环境
sudo apt install xfdesktop4  tightvncserver xfce4-terminal xfce4-panel ttf-wqy-zenhei ttf-wqy-microhei language-pack-zh-hans-base language-pack-zh-hans

设置桌面显示中文¶

英语普通4级的我，桌面环境还是用母语熟悉。

# 设置中文环境
sudo dpkg-reconfigure locales
# 时区
sudo dpkg-reconfigure tzdata

初始化vnc，设置密码和xstartup环境¶

完成后相关配置文件都在$HOME/.vnc文件夹内，复制文件夹设置权限归属即可，不须重新配置。

初始一个默认.vnc文件夹¶

vncserver -localhost :1 # 开启1号，只监听在127.0.0.1本地lo网卡 # 监听0.0.0.0可用 vncserver :1  
vncserver -kill :1      # 关闭1号

修改~/.vnc/xstartup，登录vnc后的启动桌面命令¶

文件最后一句内容

startxfce4 &

使用vncpasswd命令设置vnc密码¶

vncpasswd

vnc启动与安全¶

参考上面即可。如监听localhost地址，可用ssh本地转发功能建立ssh隧道再进行连接。

ssh -gfTNL 5901:localhost:5901 host # vnc的1号端口对应5901, 2、3等端口对应递增。

vnc服务要开机启动¶

因版本不同差别较大,需要配置较多，vnc服务不是常用，不需开机自启。

参考¶

How to Install and Configure VNC on Ubuntu https://www.digitalocean.com/community/tutorials/how-to-install-and-configure-vnc-on-ubuntu-16-04

How to install VNC on Linux ( GUI for your Linux VPS ) https://www.interserver.net/tips/kb/install-vnc-linux-gui-linux-vps/

Linux迷+Python粉

Python开发前端Web程序指南：无需写HTML、CSS、Javascript代码的多种实现概览

理论介绍¶

网络从来就不是真正为应用程序设计的：¶

因此我们明白为什么纯 Python Web 开发是必要的：¶

NOJS Web 开发的 Python 方法概述¶

我该如何避免使用 JavaScript？让我来计算一下…¶

实用指南¶

A 类系统的要求¶

A级：工业强度坚如磐石的产品¶

anvil（译者：第一位是软广告，可跳过）¶

建立在skulpt[雕塑]之上¶

参考文章-刊物¶

实例走廊(Demo Gallery)¶

Panel¶

基于Bokeh构建¶

实例走廊(Demo Gallery)¶

Dash¶

基于plotly 和ReactJS 构建¶

资源¶

讨论和出版物¶

应用领域¶

从C级到A级¶

NiceGUI¶

“感谢 Streamlit”¶

基于 FastAPI 构建¶

不可链接的锚标签：¶

实例走廊(Demo Gallery)¶

讨论¶

IDOM (已改名ReactPy)¶

基于 ReactJS 构建¶

讨论¶

Epyk¶

Flet¶

讨论¶

Pynecone (已改名reflex)¶

可扩展性随手可得！¶

参考链接¶

实例走廊(Demo Gallery)¶

讨论¶

Lona¶

讨论¶

Nagare [流]¶

Reahl¶

B 类：某些项目完全可接受的构建块¶

Gradio¶

相关出版物¶

Shiny for Python¶

Htag¶

Demo演示¶

讨论¶

Neutron [中子]¶

Vue.Py¶

JustPy – 另一个 Vue.js 包装器¶

构建 NiceGUI¶

出版物：¶

pyfyre¶

讨论¶

基于 Brython 构建¶

Transcrypt¶

Zython¶

讨论和文章¶

Bokeh¶

pyodide (碘化物)¶

构建块¶

文章¶

接触¶

PyWebIO¶

示例代码¶

Skulpt and Brython¶

相关阅读¶

- https://www.reddit.com/r/Python/comments/2yli88/whats_the_best_implementation_of_a_python/¶

skulpt (雕塑)¶

构建模块……¶

PyWeb3D¶

建立在：brypthon¶

文章和应用¶

brypthon¶

Reacton – 用于 ipywidgets 的 React 纯 Python 端口¶

讨论¶