performance problems on lower end devices

[MoralCode]

creating this issue to separate this issue out from the conversation in https://github.com/Y0ngg4n/fluffy_board/issues/27#issuecomment-1536836667

i am saving the data in json files and i have to figure out a more performant way to save the data. I think the best way would be to migrate to Isar but that needs a complete rewrite of the current schemas.

[Y0ngg4n]

Todo:

• [ ] Rewrite state managment to Riverpod
• [ ] Switch from local json files to isar database and provide export and import to json

For the beginning thats enough to do.

[MoralCode]

Im mainly curious about what led you to these conclusions. Do you have specific devices that have performance issues? What led you to believe these rewrites are needed?

[Y0ngg4n]

So i already have implemented multiple perfornance improvements. For example if you draw a line the points are not displayed on the canvas as you would think of it. First i throw an optimization function on it to reduce the number of points. Second i make an image of that points and just display the image because that takes less power to calculate. So the problem is that if you have a whiteboard, the loading of all of these points takes linearly more time. a better approach would be to throw it into a database and do some kind of clustering, so you only display the points that are in a given bounding box.

[MoralCode]

Using images feels a little janky to me, but I guess if it works it works (also your app your rules haha).

Personally i think it may make sense to try and (possibly with user choice as to how it works) either a) convert/smooth the points into like lines/curves sorta like how SVG works (maybe svg can be used as a base - layer/canvas for the whole board too), or b) allow the user to flatten their whole whiteboard into a single image to optimize performance at the expanse of being able to undo before the point of the flatten.

[Y0ngg4n]

@MoralCode you don´t want it with points believe me. i was really frustrated about that performance issues and i was very happy when i found some blog that had the same issues and described this solution and i was even more happy when i got it working. The problem with points is that a single 5 cm line can cause so much lag because it has multiple thousands of points to render. So the image solutions is really the best workaround.

The svg thing.... i tried it... it is not really working out. this project had many frustrating nights with many headaches to provide it like this XD. The SVG thing works if your canvas is limited but not with unlimited canvas. I know it sounds kinda crappy the workarounds i have choosen. but often there was no other way to get it with that performance. but i am always open for better solutions :)

[MoralCode]

Do you have a link to that blog post or other resources you learned from?

I also wonder if part of the performance problems come from trying to start off with an unlimited canvas immediately. Maybe it would be better to start with a small canvas tha can grow as the user adds things that go over the edge, similar to how minecraft worlds generate in chunks or how https://diagrams.net will expand the canvas size as you place something over the edge.

Now that i think about it, if the whole app needs rewriting anyway, maybe pivoting to becoming a diagrams.net mobile app may honestly be a decent move. They have an open product and liekly already figured most of this infinite canvas and performance stuff out, all that would be needed is to figure out the drawing/pen input (which it seems like needs redoing anyway and makes me think of trying to emulate how reMarkable does it on their tablets tbh). They also probably have a lot of users who would want a mobile app (even if unofficial) so that may be a good collaboration opportunity and/or injection of users to help keep things moving if you have other things to work on

[MoralCode]

seems like theres an issue opened in 2020 on the draw.io repos about making a mobile app that was closed due to lack of interest.time on their side as well. https://github.com/jgraph/drawio-desktop/issues/329.

It would be a lot of work (especially rearranging the draw.io layouts for mobile devices) so im not sure this would be feasible with the current resources, but it feels kinda wrong to me that there don't seem to be many existing open source whiteboard-like apps on fdroid for people who want to make quick sketches on the go or throw together a quick diagram for a presentation.

[Y0ngg4n]

no the infinite canvas from beginning is no problem, because if it is blank there does not get rendered anything. I allready have a check to only display things that are in your display bounds. but if you are drawing very much in your display bounds it gets slower and slower. so i have to figure out a method for that. Diagrams.net uses a complete other technology. they are using web canvas. they are completely different from flutter canvas.

[Y0ngg4n]

@MoralCode i am sorry i cant provide you a one click solution but i am developing this in my free time. And it was allready hard to get it like this.

[MoralCode]

My apologies, it wasnt my goal to dump a bunch of work on you, i was mostly just curious to read that blog post you found. I just ended up getting a little too distracted by other potential ideas that would require a lot more work. Apologies for wasting your time with ideas that should have been better-researched first

[Y0ngg4n]

@MoralCode dont think that. you didnt wasted my time. i am glad that somebody is interrested in that project and if i could i would definitly put more time and work into it. I mean maybe we can make like a plan with the things that need to be absolutely fixed and work from that along. Sadly i lost the link to the blog and never found it again. searched for hours...

If you have ideas how to improve the performance i would be glad to hear them 🙂