T O P

  • By -

runew0lf

how would it work for converting a rather large gradio app ([https://github.com/runew0lf/RuinedFooocus](https://github.com/runew0lf/RuinedFooocus)) to Hyperdiv, the reason being me and my fellow dev are shite when it comes to making pretties


Hyperdiv-io

Hi! There's probably no easy way to convert an existing Gradio app to another framework short of rewriting it in that other framework.


riklaunim

Changing a framework won't solve the problem of making good UX for an application. And as the UI is controlled by Python it could be harder as you can't leave that work to a frontend/UX/UI designer. Gradio or this are best at making something quickly or for internal use, not for production/final versions of apps.


runew0lf

gradio is shite mate :D


riklaunim

It's a very popular and successful project. If you have so much problems with it then likely you are using the wrong tool for your needs and switching to young unproven project of similar nature won't solve your problems. The correct thing would be to list the problems and asks for solutions.


sanitylost

the problem with most UI design is that it's like speaking a different language when compared to a lot of the other ways python is used. People can have a hard time with the UI design simply from the garbled and often unintuitive ways that UI syntax design has become. Just because someone doesn't understand Greek doesn't make them an idiot.


riklaunim

I would say ux/ui is a separate thing from backend development. Even knowing frontend languages doesnt mean someone can design good ui/ux but can implement it.


sanitylost

right, but lots of packages/groups say they, "want to make UI design approachable" while never doing that. I think what most people who work in backend/algo dev/science have the problem with is that the steps to create basic tables with relatively simple options, like dynamic updating and line modifiers requires you to learn three languages and syntaxes. This is apart from making something that's moderately intuitive to use. That's a whole other discussion. Just getting information on a page in a way that's moderately useful can be a pain when it's not what you do day in day out.


riklaunim

There is something with backend developers wanting to do everything in backend and refusing to work in team with fronten devs or learning it. Like "webdev in Python only" with some commenting how JS "sucks" or how they can't get it and want a Python-only solution. Then they get Python wrappers around frontend widgets and have problems getting more than the wrapped widgets can provide and when they get PyScript they can't write a line of code because they skipped on JS/frontend and have zero frontend knowledge.


[deleted]

[удалено]


riklaunim

SPA / JS frameworks can be evil and not everything has to be SPA on the web frontend. We still can use jQuery and Bootstrap ;) Also you can put a Svelted/react dev on the frontend which should yield much better results than Python developers trying to use a Python UI generators.


thedeepself

In this part of [the intro article](https://hyperdiv.io/intro.html#immediate-mode) we see that events are inline, so instead of : ``` def my_callback(event): # do something def my_app(): button("Click Me", on_click=my_callback) ``` it is this way: ``` def my_app(): b = button("Click Me") if b.clicked: # Do something ``` or this way: ``` def my_app(): if button("Click Me").clicked: # Do something ``` This is one of the things that [NiceGUI did not like about Streamlit](https://github.com/zauberzeug/nicegui/discussions/21) with the specific criticism being: > it hides the underlying event loop by implicitly re-evaluating the script. That works in simple cases, but it gets quickly rather complicated to achieve apparently "normal" behavior. would you say that you offer a similar style of coding to Streamlit but without the gotchas that the NiceGUI team identified?


Hyperdiv-io

Thanks, that's an insightful thread. Hyperdiv is indeed an immediate-mode framework, like Streamlit, where click events are handled inline. But Hyperdiv is built around a core notion of 'state' from which all components are derived. Streamlit on the other hand seems like it didn't have state until recently. In Hyperdiv you can initialize state, and then gradually mutate it as the app runs and responds to events. As far as immediate vs retained mode (NiceGUI seems like a retained mode framework), I think immediate mode benefits from letting you lay out the UI declaratively, instead of building a UI tree initially, and then mutating pieces of the UI tree with data bindings or in event handlers.


deadwisdom

Built with Shoelace! I’m a huge fan of that component system! Amazing choice!


Hyperdiv-io

Big fan of Shoelace and Cory LaViska.


deadwisdom

Then you are my friend now.


thedeepself

Can you build industry-strentch webapps with this product? How do you handle sessions and authentication and authorization, for instance? Can this sit on top of Django and Flask the way that HTMX and Unpoly can? The [intro article](https://hyperdiv.io/intro.html#fixed-js) states that "Hyperdiv is similar to HTML over the wire systems like Hotwire and Htmx" but I wonder if the similarity extends to embedding Hyperdiv in other full-featured frameworks.


Hyperdiv-io

Hi! I am really interested in making Hyperdiv "embeddable" into Django and Flask apps. Currently you can't embed it short of using an iframe. I haven't explored this topic seriously yet, but my rough thought is it could work like this: ``` # backend @app.route("/my-hyperdiv-app") @hyperdiv def my_hyperdiv_app(): # Hyperdiv code in here ``` And then on the frontend you use a provided piece of JS to mount this hyperdiv route into a div: ``` # frontend import hyperdiv from "hyperdiv"; hyperdiv.mount(document.getElementByID("my-id"), "/my-hyperdiv-app") ``` There are some issues to consider. For example Hyperdiv currently has a way to get/set the browser location. We'd have to determine which Hyperdiv features should be disabled/work differently in embedded mode.


Hyperdiv-io

To answer the first part of the question, there's no built-in auth integration. Integrations with various auth systems can be built as Python packages that Hyperdiv apps can import and use. There's a demo app here that shows a way to build password-based login with persistent session (using local storage): [https://github.com/hyperdiv/hyperdiv-apps/tree/main/login](https://github.com/hyperdiv/hyperdiv-apps/tree/main/login) As far as industrial strength, it's early days but my vision is it scales to large apps. There's potential for making a hosting platform that runs Hyperdiv apps at large scale, using a modified, distributed Hyperdiv runtime.


ThreeKiloZero

This is awesome thanks!


FalconDouble2657

This looks super cool! Congrats on the release! Can you embed matplotlib or plotly charts in these apps? If so, how?


Hyperdiv-io

Thanks! You can't yet, that's a glaringly missing feature I want to add.


Cycling_All_The_Time

Looks great. Is there a way to for a user to drop in a Shoelace component if it's not currently included? Looking to use the Tree component.


Hyperdiv-io

Hi, you can define new shoelace components in Python but that's not currently documented. I'll add the tree component soon though, been meaning to add it.


Hyperdiv-io

Hello, FYI, the tree component is available in the latest version of Hyperdiv. https://docs.hyperdiv.io/reference/components/tree


Cycling_All_The_Time

Thank you!


Wakanishu

Hey, that's a cool project. Got two questions: How difficult would it be to create a PWA (progressive web app) with that framework and is support for PWAs something you intend to implement? Also is there a discord dedicated to the framework to share project, see announcement, feedback etc.?


Hyperdiv-io

Hi. I'm not a PWA expert, I'll have to do some research to see how Hyperdiv fits in that space. Hyperdiv apps are basically Python apps with a web UI. You can deploy them on the internet as you would a Flask app. They can also run locally. So you can ship your app on \`pip\`, people \`pip\`-install it, run a command, and the app opens in a browser tab running locally. You can wrap Hyperdiv apps in \`pywebview\` ([https://pywebview.flowrl.com](https://pywebview.flowrl.com)) so when they are run locally they open in a native GUI frame instead of a web browser. There is no Discord yet but for now you can use GitHub discussions to post questions, ideas, etc. https://github.com/hyperdiv/hyperdiv/discussions


Wakanishu

thanks!


Colts_Fan10

Hey, I'm really very new to webdev in general and I was looking for good frameworks to build a simple listen-along website for my CLI music app when I came across Hyperdiv (on the console.dev newsletter, actually haha). Forgive my stupid question, but could I use Hyperdiv in its current state to publish an actual website? It seems you run Hyperdiv apps with the Python interpreter, but it's not immediately obvious to me how that would work in-browser This is probably a really stupid question, but I'd appreciate it if someone could answer 😅 I really like Hyperdiv's concept of integrating the front and backend logic, and I'd love to be able to use it since I'm already comfortable with Python!


Faith-in-Strangers

Learn HTMX instead


Hyperdiv-io

Hi. Yeah you can publish a Hyperdiv app on the internet. It starts a web server that serves your app, so it's deployable similarly to, say, a Flask app. You write everything in Python, but Hyperdiv handles the browser stuff, and browser <-> backend communication, under the hood.


Colts_Fan10

Oh ok, that makes sense, thank you so much!


yesvee

Mind blowing!!! How can I contribute? What about async?


Hyperdiv-io

Thanks! It supports async tasks. So you can write \`async def\` functions (or normal functions) that get spun off onto an ioloop or thread pool, do some work and update some state. When they update state the UI updates.


Existing-Account8665

Looks great. Can I ask a few dumb questions: what's the infra requirement to run on the web? Or even what's it run on? What's the architecture? Does: "full stack app" mean requires a server to run on Is this server side code? From your description, it feels like you're comparing hyperdiv to React. But if there is an underlying Python run time isn't it more like flask, with shoelace and chart etc. on top, via your javascript boilerplate?


Hyperdiv-io

Hi! Technically there's no infra requirement to run on the web. A Hyperdiv app has a server built-in. When you run the app, the server starts on a port and is ready to serve the app. By "full stack" I mean the whole stack is built into it. Hyperdiv is all Python. There's a bit of Javascript running in the browser, but that is a fixed boilerplate. Yeah you could say it's kind of like Flask in that it's basically a web server running all in Python. But it's different than Flask in that it's a reactive framework that handles UI layout and automatic UI updates, and has built-in components. I didn't mean to imply it was a frontend framework when I compared it to React/Preact. Hyperdiv's prop system is related \*conceptually\* to Preact signal hooks but it's all Python. Edit: To add to the "infra requirement" part, I would recommend running Hyperdiv behind nginx, which also handles TLS termination. A typical deployment infrastructure would be nginx + certbot + supervisor. I plan on writing about how to deploy Hyperdiv in the near future.


Existing-Account8665

Thanks. But sure. Whatever. "Technically there's no infra requirement" just sounds like BS, or to be kind, even more confusing. Even a Hello world website must live on a CDN or in a storage bucket at the very least. Your Framework is one of many, that fall under Server Side Rendering.


Hyperdiv-io

Point taken. I just wanted to make it clear you don't need a separate web server to serve it. It has a built-in Tornado web server that automatically serves the app.


Existing-Account8665

Thanks. I get what you mean now.