Flutter-Neumorphic
Flutter-Neumorphic copied to clipboard
Idean
Sluggish UI
Are you going to ever optimize your package? It has severe performance issues. Here is example of our project https://apps.apple.com/ru/app/bioniq/id1526819557 First version of this app was built on Cupertino and it was smooth. After we switched to Neumorphic, the lags appeared, performance lowered, sometimes down to 5 fps during animations! Even on your pub.dev page, on the pictures, the lags are noticable: https://github.com/Idean/Flutter-Neumorphic/raw/master/medias/playground.gif
@subzero911 I think the package still in beta and not have huge support, you can investigate what exactly slow performance and share results here. Maybe it can be some compare benchmarks or anything else? Maybe someone dug into this problem?
on the pictures, the lags are noticeable
it is a gif, or maybe, it was made on an emulator
I'm curious about this as well, and have spent time in the flutter dev tools to try and understand but the flame charts provided little clarity. I switched from another neumorphic package named ClayContainers, bc I felt like this package was more complete, but after I switched everything out I started to get some stuttering. I have been going through the screens and scaling back the amount of neumorphism used until it is smooth.
Edit: Once again its hard to get a clear answer from the devTools, but it was leading me to AnimatedContainer, and I kept thinking, I'm not using any AnimatedContainers, then I discovered that every Neumorphic is an AnimatedContainer, which seems odd if you just want a Neumorphic to be a box.
I found the same performance problem after I used this package, it slows down the scrolling animation if I use many neuromorphic buttons on a page.
According to the Flutter Docs, there are several widgets that are particularly consuming resources if they invoke saveLayer() behind the scenes such as Opacity, ShaderMask, ColorFilter, Chip, Text etc.
https://flutter.dev/docs/perf/rendering/best-practices
To perform a Neumorphic design, you got to have at least for a container 2 shadows, some blur, and some clipping. Even a shaderMask for those gradients, if you want those concave and convex. So if you want performance without good code quality, stay away for Neumorphic.
Otherwise I use it on easivio quitte intensively. We had to maintain low level of rebuild, and only select widgets candidate for rebuild. Also had to add some repaintBoundary, but at the end we reach those 60fps, and even 120fps on newer phone like S20GE (not even a beast in GPU performance)
Also, keep in mind this is a open-source, so you can improve it, if you feel like it.
but it was leading me to AnimatedContainer, and I kept thinking, I'm not using any AnimatedContainers, then I discovered that every Neumorphic is an AnimatedContainer, which seems odd if you just want a Neumorphic to be a box.
It may be an option to add an animated parameter for all Neumorphic widgets and use AnimatedContainer only if animated is true, regular Container otherwise. It could significally reduce resources consuming.
Hi, this plugin has been low maintained lately, despite its potential and community use.
What are the solutions that you purpose for performance improvements?
Hi, this plugin has been low maintained lately, despite its potential and community use.
What are the solutions that you purpose for performance improvements?
As @m-j-g noticed, you extensively use AnimatedContainers for all widgets. It possibly may be the cause. If I'm not planning to animate the widget, I don't want to use AnimatedContainer for it.
You can try to add animated parameter (false by default) and use regular Container if animated is false, and check whether it would improve the performance. I didn't tested it yet and I'm not 100% sure, just an assumption.
@subzero911 You might want to look into this: https://docs.flutter.dev/perf/rendering/shader
