NiceGUI 已经 1.0+, 已移除 JustPy 依赖, 只基于 Vue 3 + Quasar 2 + Tailwind 3, 加载速度很快! - V2EX
V2EX = way to explore
V2EX 是一个关于分享和探索的地方
现在注册
已注册用户请  登录
推荐学习书目
Learn Python the Hard Way
Python Sites
PyPI - Python Package Index
http://diveintopython.org/toc/index.html
Pocoo
值得关注的项目
PyPy
Celery
Jinja2
Read the Docs
gevent
pyenv
virtualenv
Stackless Python
Beautiful Soup
结巴中文分词
Green Unicorn
Sentry
Shovel
Pyflakes
pytest
Python 编程
pep8 Checker
Styles
PEP 8
Google Python Style Guide
Code Style from The Hitchhiker's Guide
akaHenry
V2EX    Python

NiceGUI 已经 1.0+, 已移除 JustPy 依赖, 只基于 Vue 3 + Quasar 2 + Tailwind 3, 加载速度很快!

  •  
  •   akaHenry 2023-06-11 11:29:16 +08:00 4879 次点击
    这是一个创建于 901 天前的主题,其中的信息可能已经有所发展或是发生改变。

    NiceGUI 介绍:

    • https://github.com/zauberzeug/nicegui
    • 之前依赖 JustPy, 加载速度非常慢, 现在已经移除 JustPy.
    • 只依赖 Vue 3 + Quasar 2 + Tailwind 3. 实测加载速度非常快! 完全可用.

    官网演示:

    更新评价:

    • 200 天前, 评价过这个项目.
    • 200 天后, 再看, 移除 JustPy 之后, 加载性能非常好!(代码做了大量重构)
      • 实测开发效率非常高, 上手很快.

    本人实测 demo:

    Mac + Desktop App 预览效果:

    目前存在的问题:

    • 生态很小, 几乎没有. (比较 200 天,才有讨论, 加上首次观感极差!)
      • 好在 1.0+ 源码非常简单, 可读性很好. 1 天不到, 就掌握 7788.
      • Vue 3 + Quasar 2 + Tailwind 3 本身表达能力就很强. 弥补了劣势.
    • 打包问题:
      • 使用 PyInstaller 打包成 desktop app, 有 bug. 不正常. 打开+直接退出. (还在调试)
      • 原生不支持更改打包 app icon, 基于 PyInstaller 参数, 可绕过 + 支持.
    • system tray 问题: 系统托盘图表.
    第 1 条附言    2023-06-11 12:29:46 +08:00

    对比其他 Desktop(Web) APP 方案:

    • flutter, tauri + vue, electron 我都有实测经验.

    Tauri + Vue.js + Element-plus/ Quasar + Tailwind:

    • Tauri + Vue.js 是比较搭的组合.
    • 原因很简单, 如果选 react.js, 那配合 electron 和 react-native 收益更大.

    优缺点:

    • tauri 的方案, 目前也是 desktop app 首选. 基于 rust + 前端生态, 生产力拉满. 包体积小, 开发效率高.
      • tauri mobile, 也已支持, 实测效果惊艳. (alpha 分支)
    • nicegui 和 tauri, 其实总体路线一致. python 写 UI 代码更少. 二者不冲突.
    • 可以拿 nicegui 写小工具, 打包体积大. 但开发效率更高. 复用 python 生态, 更加无敌.
      • 毕竟不是专业前端, 对 js 轮子显然没有对 python 更了解. (主观个人感受)

    Flutter:

    • 截止目前, flutter desktop 场景, 依然不可用. 有很多重大 bugs 未修复. 不建议使用.
    • flutter mobile 比较推荐.

    Electron:

    • 不在意打包体积 + 跨平台兼容性更好 + 偏好 react.js, 首选 Electron. (相比 tauri)

    其他 python Web UI 方案:

    • 原生GUI方案(Qt 类), 就不讨论了
    • 开发效率和生态, 完全不能比. (你用你随意, 我用我不用)
    • 其他未列举的 Web UI 方案, 综合 生态+易用性+技术路线, 个人不推荐. (如果有更好的, 可以反驳)

    pywry:

    实测:

    • 编译的包体积很小, 也是 前端方案, 路线和 nicegui 重叠. 更解耦.
    • 适合熟悉 tauri 和 wry 的, 未来挺有价值. (绕开 nicegui 的一些问题)

    Streamlit:

    • https://github.com/streamlit/streamlit
    • 简单跑了demo 和看文档, 这东西, 确实过于复杂, 不符合我的偏好. (个人不推荐)
    • 易用性不如 nicegui, 完备度不如 turi.
    第 2 条附言    2023-06-12 20:23:33 +08:00

    更新模板页演示效果:

    • 可以拿这个模板, 直接写应用.
    • 代码也很简单+直观.

    25 条回复    2025-02-17 09:57:57 +08:00
    akaHenry
        1
    akaHenry  
    OP
       2023-06-11 11:30:46 +08:00
    ## 其他补充:


    ### NiceGUI vs JustPy 对比:

    - https://github.com/zauberzeug/nicegui/discussions/134#discussioncomment-5338495
    - 作者解释 nicegui 1.0 之后, 完全移除了 JustPy 依赖. 赞!
    - https://github.com/zauberzeug/nicegui/discussions/247
    - NiceGUI is based on Vue 3, Quasar 2 and Tailwind 3.
    - JustPy, in contrast, still uses Vue 2, Quasar 1 and Tailwind 2.


    ### 关于 Quasar 2(Vuejs UI 框架):


    - https://quasar.dev/vue-components/tabs
    - NiceGUI 暴露了 `Quasar 2` 的 props 和 slots, 使用 `Quasar 2` 非常简单.
    - NiceGUI 源码注释很贴心, 直接贴了 `Quasar 2` 文档链接.
    - 在这之前, 完全没用过 `Quasar 2`(有 vue3 经验). 参考注释, 使用 `Quasar 2` 没有障碍!

    > 关于技术选型的思考, 多说一句:

    - 虽然我之前一直在使用 vue3 + element-plus, 短暂使用 [naive-ui]( https://www.naiveui.com/en-US/os-theme)(组件不全).
    - element-plus 挺好用, 文档也完善.
    - 但考虑到 `国人项目`, 老外几乎不用. (潜在问题, 国外新项目的技术组合, 就几乎不会基于 `国人项目`)
    - `Quasar 2` 国内极少有人用, 之前看 v2 前端的评价(不高), 就没关注.
    - 实际 `Quasar 2` 的体验, 挺好, 也并不复杂.(还是不能轻信他人评价)
    - 想说的是: 如果同类竞品, 有国外项目, 个人建议尽量选国外项目.
    - 不是崇洋媚外, 仅从未来生态丰富度 /现实意义思考.(复用更多开源成果)
    roundgis
        2
    roundgis  
       2023-06-11 20:07:32 +08:00 via Android
    @akaHenry 最近用了 quasar 得挺好用的
    SoulMelody
        3
    SoulMelody  
       2023-06-12 05:53:14 +08:00
    还有集成了 vuetify 的 trame https://github.com/Kitware/trame ,它支持数据双向绑定,语法比 nicegui 更贴近 vue 一些
    akaHenry
        4
    akaHenry  
    OP
       2023-06-12 16:58:02 +08:00
    @SoulMelody 可以.

    这个看起来主要是绘图相关的?

    nicegui 打包了 Quasar, 写页面的完备性, 高一些. 而且也集成了一堆图表库, 绘图也方便的.
    akaHenry
        5
    akaHenry  
    OP
       2023-06-12 20:07:59 +08:00
    更新了 UI 设计, 目前的这个 UI 配色, 已经可以拿去直接用了.
    M4rs
        6
    M4rs  
       2023-06-20 22:31:13 +08:00
    写得很详细
    lchynn
        7
    lchynn  
       2023-09-22 13:27:37 +08:00
    能不能加一个和 reflex ( reflex.dev )的对比呢? 这个 star 比 nicegui 多很多了。
    ( V2EX 有个介绍贴: t/963602
    akaHenry
        8
    akaHenry  
    OP
       2023-09-26 18:19:34 +08:00
    @lchynn


    粗略看了下 reflex 官方文档, 设计风格是偏 flutter 的. 我也写过 flutter.

    不过感觉这个 reflex 没有 nicegui 简洁, nicegui 是很地道的 python 代码写法.

    reflex 这种抄 flutter, 有点不伦不类.(很不 python)

    nicegui 是 基于 vue.js + Quasar(UI 框架) 的. 也提供了 hack 入口, 即使 nicegui 一些 API 还未对齐, 也可以 hack 进 vue.js, 用纯前端的方式来实现一些功能.

    so, nicegui 的完成度更高, 未来上限更高. 充分利用 vue.js 和 Quasar 的强大, 站在巨人肩膀上.

    站在当前节点, 类前端(web)方案, 是开发效率最高的 GUI 方案. 非 web 方案, 不值得投入时间研究.
    pythonwood
        9
    pythonwood  
       2023-10-09 21:11:12 +08:00
    1 年前在等 vuetify3+vite ,现在发现 reflex/nicegui ,从而发现 Quasar 也很好。
    这些年前端变化多端,希望能有个武林盟主,或者 2 、3 个带头大哥就可以了
    azev
        10
    azev  
       2023-12-01 10:43:40 +08:00
    搜到这了 问个问题
    就是运行 nicegui 的时候 发现有些 css 没有载入( http:127.0.0.1:8080/_nicegui/1.2.24/static/***.css )
    未加载,因为它的 MIME 类型 "application/x-css" 不是 "text/css"。 这个问题好像我之前做写 gin 程序也遇到过
    好像 flask 也遇到过 需要改下代码就可以
    但奇怪这个问题问的不是特别多,难道跟电脑和系统也有关吗?
    回到 nicegui 该怎么弄呢?
    cl80
        11
    cl80  
       2023-12-22 09:04:00 +08:00
    可以使用 自定义的 vue 组件吗
    akaHenry
        12
    akaHenry  
    OP
       2023-12-2 10:42:21 +08:00
    @pythonwood 我目前认为 quasar 可能是最好的 vue.js UI 框架, 比国内的 element 等几个 UI 项目都要好用, 完成度和多平台一致性更好.

    文档也更好.

    缺点是中文社区用的人少, 有问题去官方 discord 搜. 还行.
    akaHenry
        13
    akaHenry  
    OP
       2023-12-22 10:44:54 +08:00
    @azev 你这个问题, 完全没遇到过. 是不是你本地开了 VPN, 梯子代理干扰了?

    我是 macOS 平台, 没遇到过.

    你可以用 native 模式(desktop app 模式) 运行看看, 排除是不是浏览器的问题.
    akaHenry
        14
    akaHenry  
    OP
       2023-12-22 10:47:20 +08:00
    @cl80 可以使用 vue 自定义组件. 最近 nicegui 升级了几个版本, 对自定义 vue 组件, 更加友好.

    PS:

    我的 repo 里, 有参考官方示例, 写了个 SPA 模式的 demo, 路由切换, 就不会强制刷新页面了. 很适合用来打包 app.

    可以参考.
    xiaozizayang
        15
    xiaozizayang  
       2024-04-20 22:45:53 +08:00
    作者,请问现在 nicegui 发展得如何了?
    akaHenry
        16
    akaHenry  
    OP
       2024-04-21 13:51:38 +08:00
    @xiaozizayang

    nicegui 更新很活跃, 文档也一直更新+完善.

    德国人的项目, 质量都比较高, 也很少烂尾.

    Vue 3 + Quasar 2 是我目前专注的前端方案, 如果你也偏好 vue, nicegui 用起来会非常顺手.

    个人小项目, 拿他画个 UI, 非常快.

    关于打包成 Mac/Windows 问题, 这个属于是 Python 打包通病, 很难搞. 各种打包方案, 都有坑.

    如果不考虑打包, 或者 docker 部署. 可以放心用 nicegui. 体验很流畅.

    (nicegui 最近也在路由支持 SPA 模式, 对写 app 友好)
    xiaozizayang
        17
    xiaozizayang  
       2024-04-21 14:21:09 +08:00
    @akaHenry #16 感谢耐心回复,我是需要打包 windows ,也期望一套 python 生态能搞定,如果能在打包上做到相对自动化体验会好很多,毕竟能折腾这一套的其实更愿意选择 electron 或者 tauri 了

    https://github.com/better-py/learn-py/issues/5

    这个项目的那个解决方案评论者是你么?
    akaHenry
        18
    akaHenry  
    OP
       2024-04-21 14:35:42 +08:00   1
    @xiaozizayang 是我.

    pyinstaller 之类的工具, 我都测试过. (遇到一堆坑, 浪费了蛮多时间无果)

    有几个客观原因, 我的开发环境是 M1 Mac, 有不少编译问题, 是 M1 Mac 导致的.

    (排错过程, 不少 issue 别的平台, 相同编译参数, 是正常的, 但是 M1 Mac 不正常. 我也没时间换个机器验证, 就放弃探索了. )

    ------------------------------------------------------------------------------------------------------------------------

    https://github.com/better-py/learn-py/tree/main/packages/py-try/try-nicegui

    这个示例项目, 有多个 build.py 脚本, 以及 taskfile.yml 里也有几个编译参数.

    如果你有时间折腾, 也可以继续探索 + 验证. (如果开发环境是 Windows, 说不定有些参数, 编译是正常的)

    ------------------------------------------------------------------------------------------------------------------------


    如果你没空折腾, 我回复的绕路方案: 就是类似 Sublime Text 这种, 打包了 Python 的运行环境. (也就是 Java App 日常打包 JRE 运行时的操作)

    缺点: 是增加包体积 + 每个平台都要单独打包, 优点是: 基本可以秒开.

    这个方案, 成熟无坑. 最新的 Python 标准库, 提供了绿色 Python 的打包工具. 比较容易搞定.
    xiaozizayang
        19
    xiaozizayang  
       2024-04-22 11:04:37 +08:00
    感谢回复,现在体积大也不是不能接受,如果只针对 win ,绿色模式其实只要打包一次就行了对吧
    akaHenry
        20
    akaHenry  
    OP
       2024-04-22 11:34:37 +08:00   1
    @xiaozizayang 对. win 打包一次就行.

    ( ARM + win 平板那种, 需单独打包, 普通 x86 + winPC 打包一次即可)
    zfox
        21
    zfox  
       2024-05-31 09:50:52 +08:00
    没用过,但是看起来还不错,支持下
    i1MqODKe0P16t1Ra
        22
    i1MqODKe0P16t1Ra  
       2024-06-18 11:35:27 +08:00
    nicegui 非常好!解决了后端人员需要自己展示 UI 的需求。
    babywhisper
        23
    babywhisper  
       285 天前
    感谢楼主分享,我使用 NiceGUI 制作了一个习惯追踪的应用: https://github.com/daya0576/beaverhabits

    后续计划开发移动的客户端,一开始希望使用 PWA ,但发现两个缺点:
    1. 苹果 iOS 系统支持一般
    2. 无法让 python server 直接跑在移动端上

    所以想请教一下,各种全平台的方案中,有没有可能将 NiceGUI 服务端直接一起打包,供用户在苹果/安卓手机上安装?
    akaHenry
        24
    akaHenry  
    OP
       285 天前
    @daya0576 #23

    如果是基于 NiceGUI 方案, 应该无法编译成 iOS/Android 应用.

    如果你只熟悉 python, 可以看看 flet 方案( python + flutter 混合方案)

    https://flet.dev/

    但是 flet 方案, 我实测效果, 也很一般


    https://github.com/better-py/learn-py/tree/main/packages/py-gui

    这里有基于 flet 写的示例 demo.

    如果你使用过 flutter 做开发, 可以考虑. 否则, 不建议使用. (可能搞不好开发环境)

    python + mobile 开发, 没有良好方, 包括 kivy, 都有各自的缺陷.


    顺便, 如果你不局限于 python, 可以考虑 Tauri(rust+前端), 这个已经支持编译到 iOS 和 Android.

    使用 Tauri, 你可以搭配 Vue.js + Quasar.js (NiceGUI 就是基于 Quasar). 来写.

    顺便现在有 DeepSeek R1, 写 Rust 的难度, 大大降低, 报错就直接丢给 R1 来修.

    这个算是比较正经点的方案.

    顺便, 这里有个 tauri 的示例. (注意 tauri 2.0 已经支持 mobile app)

    https://github.com/better-rs/learn-rs/tree/main/crates/rs-tauri-vue

    https://tauri.app/

    这个 demo 没更新 tauri 版本.
    babywhisper
        25
    babywhisper  
       284 天前
    @akaHenry 多谢详细的回复,如果新的项目从零开始,Tauri 听上去是一个不错的选择。

    但已经有 NiceGUI 代码的情况下,看上去没有太好扩展到全平台的办法,所以我选择开始学习 swift :p
    关于     帮助文档     自助推广系统     博客     API     FAQ     Solana     990 人在线   最高记录 6679       Select Language
    创意工作者们的社区
    World is powered by solitude
    VERSION: 3.9.8.5 26ms UTC 18:46 PVG 02:46 LAX 10:46 JFK 13:46
    Do have faith in what you're doing.
    ubao msn snddm index pchome yahoo rakuten mypaper meadowduck bidyahoo youbao zxmzxm asda bnvcg cvbfg dfscv mmhjk xxddc yybgb zznbn ccubao uaitu acv GXCV ET GDG YH FG BCVB FJFH CBRE CBC GDG ET54 WRWR RWER WREW WRWER RWER SDG EW SF DSFSF fbbs ubao fhd dfg ewr dg df ewwr ewwr et ruyut utut dfg fgd gdfgt etg dfgt dfgd ert4 gd fgg wr 235 wer3 we vsdf sdf gdf ert xcv sdf rwer hfd dfg cvb rwf afb dfh jgh bmn lgh rty gfds cxv xcv xcs vdas fdf fgd cv sdf tert sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf sdf shasha9178 shasha9178 shasha9178 shasha9178 shasha9178 liflif2 liflif2 liflif2 liflif2 liflif2 liblib3 liblib3 liblib3 liblib3 liblib3 zhazha444 zhazha444 zhazha444 zhazha444 zhazha444 dende5 dende denden denden2 denden21 fenfen9 fenf619 fen619 fenfe9 fe619 sdf sdf sdf sdf sdf zhazh90 zhazh0 zhaa50 zha90 zh590 zho zhoz zhozh zhozho zhozho2 lislis lls95 lili95 lils5 liss9 sdf0ty987 sdft876 sdft9876 sdf09876 sd0t9876 sdf0ty98 sdf0976 sdf0ty986 sdf0ty96 sdf0t76 sdf0876 df0ty98 sf0t876 sd0ty76 sdy76 sdf76 sdf0t76 sdf0ty9 sdf0ty98 sdf0ty987 sdf0ty98 sdf6676 sdf876 sd876 sd876 sdf6 sdf6 sdf9876 sdf0t sdf06 sdf0ty9776 sdf0ty9776 sdf0ty76 sdf8876 sdf0t sd6 sdf06 s688876 sd688 sdf86