Python 折腾 web 交互的痛

[kice]

py 折腾数据可视化是真的痛。各花了一个小时去看 pywebio 和 nicegui 的文档和魔改 demo ，但是发现还是不太舒服。

先说我的需求: 一个监控系统，用于显示任务进度信息(例如，当前进度，日志显示，脚本变量); 大体上可以看作搞一个 prometheus+tensorboard 的 GUI 。

想着是开一个 HTTP 服务器监听任务信息，然后套一个前端做可视化; 前端获取任务信息进行动态更新。

pywebio 和 nicegui ，或者说其他库，例如 streamlit 啥的都是基于多会话设计，也就是访问之间没有多大关联。然后实现上来说，同一个脚本开一个 HTTP 服务器监听，然后再跑一个 UI 框架是行不通。

换句话说，监听任务信息的 HTTP 服务器单独一个脚本，然后 UI 框架再额外一个脚本，之间使用 HTTP 或者数据库进行通信。这样折腾下来不仅部署挺麻烦，还要受限与 UI 框架。

目前得出来结论是，用 jQuery+Bootstrap+Ajax 是最合适。最大的痛点是 UI 控件以及要熟悉 CSS 排版。

如果弄 react/vue 什么的，UI 控件齐全，但是环境搭建好的时候，用前面的方法应该已经做完了。本身一共就不超过 300 行代码，折腾来折腾去不就是为了省时间。

不知道 dalao 们有什么其他想法？

[emperinter]

python 可视化有个 pyecharts 可以了解一下

[rabbbit]

如果就类似大屏这种就一个页面,确实没必要折腾 react/vue.

[Abbeyok]

去年，应该说前年年底，做过几十个这种可视化的学生案例，基本上就用 pyecharts 搞定，当然，这都少不了对前端的研究（刨网上代码）

[rabbbit]

而且大屏这种页面可能一直开着好几个月都不关,搞复杂了内存泄漏也不好 debug

[shinession]

OP 试过 plotly dash 没？内置后端 flask ，前端 react ，即开即用，比 strealit 强大很多

[kice]

@emperinter @Abbeyok 感谢意见。

不过我这边也不主要是图表: 进度条，日志，图片。
感觉通用的 UI 框架比较满足需求。

[kice]

@shinession 不太行，而且用上了 flask 之类的库就不能同一个脚本里监听 HTTP 了。
我感觉 dash 在这里只是一个 py 版的劣化 jquery; 因为需要大量操作 dom ，不如直接 jquery + ajax 。

[cmhonker]

有个轮子，改吧改吧就能用了。。

github.com/cppla/ServerStatus

[DonaldVVV]

`用 jQuery+Bootstrap+Ajax 是最合适。最大的痛点是 UI 控件以及要熟悉 CSS 排版。`
可以试试 flask + layui ，基本不怎么写 css 代码
找一套稍微靠近点的模板，然后手撸一点界面
layui 的支持还是挺强大的，会 py 的话，学习成本不会很高
而且对进度条、图片都有比较成熟了的

[Richard14]

看了两遍也没看懂 OP 说什么，OP 自己看一遍能看懂吗？
首先你的需求到底是什么，究竟是简单还是复杂。如果真的很简单，你直接手写，有发帖吐槽的功夫早都写完了。如果是复杂的，那你还非得强行用别人的库组装？而且你说为了省代码，真想省代码 prometheus 满足不了你的需求？
其次实现方法这么多，你有一万种实现方法，没看懂楼主写的所谓受限于前端框架，受限于后端框架是什么意思。
第三我从头看到尾只看到一个蛋疼的人，帖子一开头来一句 py 折腾数据可视化真的痛，我没看到哪里跟 python 发生关系了

[wittyfans]

任务的这些数据存到数据库呗，然后可视化用 Dash, Streamlit 或者 Metabase 都不错。

[jones2000]

前端体力活， 直接外包呗，定义好接口基本就可以了。每必要什么都自己搞，做自己擅长的事，其他外包。

[kice]

@Richard14
需求不复杂但是也不简单，只是需求不是常见的那些类型。

我想要的东西，一言蔽之，只需要处理用户事件，然后更新界面内容就行。前端的技术框架，前后端的通信方式，甚至是数据存储方面我都不关心。或者类似 imgui 那样的风格，Immediate mode 渲染 HTML 。

目前我做完大概 py 服务器端 300 行，js 100 行，html+css 50 行。两文件复制到服务器，有 Python 就能直接运行。

如果用上其他各种框架，我认为代码量和开发时间并不会变少，而且还需要折腾一堆配置文件以及服务端程序部署。

于是想要一个方法能更快去完成这个轮子，这样以后每个项目都能用上。如果发个帖子能得到答案我觉得值得。

---

我指局限性并不止是“能不能做”，也包括“会不会增加开发成本”。

提到的可视化框架，在前端上，运行时构建 UI 会比较难折腾。在框架下实现运行时数据绑定和 UI 内容和布局更新并不比直接写 js 操作 DOM 简单。

后端我想要单个脚本单例全局变量（现有代码都是单脚本单例模式），但是 Python 的后端框架是提倡 stateless ，后端逻辑和状态数据分开。

其次如果用之前提到的可视化框架，后端设计上就受限制这些设计理念。我的想法并不是不能实现，但是做不到开箱即用，而且不能很好移植到现有的脚本（需要通过数据库或者远程 API 通信）。

我就存几个关了程序就不要的 kv ，就没有必要再搞个 redis 或者 mysql 服务器了。

---

因为 Python 的可视化开发库不太行，所以可视化和 Python 没啥关系。

[mingl0280]

你提的问题和“Python 可视化库”并没有什么关系。
要图表好看，前端用 echarts 和 bootstrap 加上 axios 足够了，Python 仅用来提供数据罢了，可视化用这个真没啥必要。

[37Y37]

如果没理解错的话，这样的需求我开发过，这个 https://blog.ops-coffee.cn/s/mml5jzqvdzbyf0f3sjn5dg ，就 jQuery+Bootstrap+Ajax

[jun4rui]

Vue 应该很简单啊，不要走 webpack 编译直接 HTML 中插 js 的方式最简单了，不折腾开发环境。

然后在 ECharts 的例子里面调代码，然后把 js 代码直接帖到 html 去，换一下数据来源就好了。

PY 好好做 json 数据接口就好了

[wenqiang1208]

如果有底层数据源的话，可以直接搭建开源的 BI 平台， 比如 superset ，用 docker 搭建好后，把数据源链接配置好，直接拖拽生成看板

[wenqiang1208]

@wenqiang1208 另外 superset 后端 也是 python ，可以参考参考

[yagamil]

前端会一个框架就满地走。反正都是套