After staking some Neurons, these popped in my mind:
- When staking neurons, the counter for current balance doesn’t update
- The Slider doesn’t listen to the keyboard. Would also help to have a number input field to precisely adjust the dissolve period. Even better would be if it had some snapping points like 6M 12M 2Y, etc.
- What are the hours for?
- Why not turning it upside down: Giving a Neuron ID and then select for which topics to follow. Currently If I want to follow one specific Neuron on all topics I have to input it 10 times. Maybe it’s just because I’m using it wrong
- There is no input validation. You can put whatever you want into the Followee Address.
- In general, UI and usability is very laggy. It crashes regularly when heavy used.
I agree with you, the UI on the app is not optimal and there’s a lot of improvement to be made.
I am a frontend engineer and happy to help, please @ililic let me know if I can support
I agree this UI can use some improvements. I’d like to add to the list:
- outline is disabled, making keyboard navigation hard
- selecting text is disabled on a lot of places
I was just looking into the stack used in the front-end. It seems that Flutter is used. I’m not familiar with Flutter, but the DOM looks very weird: the entire UI is a canvas. I’d say that if you’d use regular web technologies like HTML you get accessibility out of the box, much easier. But perhaps I’m missing some important point here
It also appears that further development has stagnated: Contributors to dfinity/nns-dapp · GitHub
I’ve been helping out with the NNS dapp from time to time. I certainly agree there’s a lot to be desired. The original developers of the dapp chose Flutter, and we’ve come to realize that is not what we want, partially because of what @dani pointed out, and we’re looking into frontend resources to help with a potential rewrite with something like Svelte or React.
Good to hear that it’s still on the radar!
Replicating current UI any of those frameworks in stead of Flutter would vastly improve a11y and UX.
Can you elaborate on why Flutter didn’t work out as expected?
I’d be happy to contribute if looking at Svelte.
Absolutely. Here’s the thinking around why we’d justify a rewrite at this point:
Interoperability with the IC frontend tools. All the IC frontend libraries that are published to date are written in TS. We managed to create a bridge between these TS tools and Dart, but that bridge is not type safe and has continuously been a source of bugs in production. The proper solution here would to be have Dart ports for all these tools.
Testing. Using a CanvasKit renderer prevents from using testing tools that rely on the DOM, like Selenium, for end-to-end integration tests. We did explore replacing the CanvasKit renderer with the HTML renderer, but even that resulted in a strange DOM and bizarre UI issues.
Team experience. Likely some of the above issues are amplified because the current team aren’t Flutter experts, and so moving to standard web technologies would be more aligned with the experience of the team (and the experience of FE developers at large).
Note that this isn’t a general critique of Flutter/Dart, but more of a critique of using Flutter/Dart for our specific use-case. Would be happy to hear your perspectives if you think there’s a better path forward.
Awesome, thanks for the detail.
I am not an expert in Flutter by any means. However, I do know that @neeboo’s team at AstroX has been building an incredible agent-dart library, but it might be more specific to native mobile than web.
Will the NNS dapp ever be a native mobile app? I noticed that it’s a PWA on my Android phone.
Thanks for the note. I would say a native mobile app is inevitable long term, but it’s not something we’re planning/prioritizing at the moment - our immediate priority is having a rock solid web interface first. Also, keep in mind that there’s nothing stopping the community from building such an app if there’s a strong interest
The current NNS app is laggy in some places like the voting tab on a 16 core 32 gig desktop.
A native web app with PWA functionality would go a long way.
The current app is everything rendered in a canvas element.