23 ms·

There are ways of handling state - which have been in use for decades! and in applications with a lot of UI state with dozens of forms (screens) etc. How many o

There are ways of handling state - which have been in use for decades! and in applications with a lot of UI state with dozens of forms (screens) etc. How many of them had these convoluted ideas of state vs stateless widgets, watch, notifiers etc? Consider examples like Visual Basic, Delphi etc.. The GUI components would be aware when their state changed and would update its own display. But now you can't do that anymore - either you redraw the whole screen or not at all. You could receive/send data asynchronously if needed in a separate thread and update the main thread which managed the GUI etc. None of this required jumping through hoops like we are doing now. Example: This is how data could be fetched asynchronously and the UI updated on termination of the call in Delphi: procedure TMainForm.ButtonClick(Sender: TObject); begin RESTRequest.ExecuteAsync( procedure begin Memo.Lines.Add(RESTResponse.Content); end, True, True, procedure(Error: TObject) begin Memo.Lines.Add(Exception(Error).Message); end; end; Note: even with all of the Pascal ceremony of begin/end etc, this code is more succinct and far cleaner and much easier to debug than the state/stateless nonsense that is spread out all over a Flutter codebase. And yes, I do remember that Visual C++ had a bit of a convoluted state management logic for MFC.

munificent 3y ago
> applications with a lot of UI state with dozens of forms (screens) etc. How many of them had these convoluted ideas of state vs stateless widgets, watch, notifiers etc? Consider examples like Visual Basic, Delphi etc. ... The GUI components would be aware when their state changed and would update its own display. I wrote and maintained a lot of large GUI applications in that style during that time, as well as building a couple of GUI frameworks that operated that way. It's fine for a while and as long as the UI is fairly static and there's mostly a 1:1 mapping between pieces of data and UI that shows it. But it scales horribly once you find yourself in a situation where you have lots of computed model data, or model data that is shown in many places in the UI, or a highly flexible UI that changes a lot. You end up in a sprawling mess of event handlers, orphaned bits of UI that aren't on screen but are still inadvertently listening to events, zombie UI that forgot to register an event handler and isn't updating, computer model state that for now good reason lives inside one random button, and then other UI code that is pulling that state from that button and breaks if the button isn't on screen, etc. The reactive style / immediate mode style where you essentially redraw the entire UI based on the current model state is so much simpler and cleaner. Yes, state management can still be weird, but that's because mutable state is hard. There's no silver bullet.
- pkphilip 3y ago
  How often do you show multiple screens open to a user at the same time? Even in desktop ERP type software you rarely ever show more than 3 to 4 screens open at a time and how often do these screens all show the EXACT SAME data fields? How often do you show more than one screen open at a time in a mobile app? How often would you then need to display the same data field in multiple screens? I think the state management in mobile apps is extremely over engineered for a use case that rarely ever happens.
  - munificent 3y ago
    Imagine you have a list of items. The list supports multiple selection. Elsewhere on the screen, you have a little box that shows the number of selected items, and the total order price of all of them. Elsewhere, there is an alert that shows up if the total order price is greater than some budget field. There is a button to order the selected items. The button should be disabled if the total price is greater than the budget. The budget amount is also a field that can be edited. First off, you have to decide where the selection itself is stored. Is whether or not an item is selected "model" state? Or "view model"? If the latter, is there a well defined place where that kind of data is stored or does it literally just list in the list UI element itself? If so, how do all of the other UI elements that need that state get it? Are they directly coupled to the list box? If a user selects "undo" does that change the selection? Is selecting or unselecting an item and undoable operation or not? If the back-end server sends an update that some item is no longer available, does the UI handle that appropriately? When the budget number changes, where does the validation logic to ensure the user chooses a reasonable number live? This is just a very simple example, but stuff like this comes up all the time and gets gnarly real fast.
    - pkphilip 3y ago
      I have handled far more complex cases than this using desktop based GUI apps in a client-server model before the word AJAX etc was even invented. Example: dependent dropdowns or even tables with row-selection leading to more detailed views. The ability to display multiple views for the same data type at the same point - example: displaying orders from multiple clients simultaneously in two different sub-screens at the same time. Also, MVC as a concept has existed for decades. GUI controls have always had a concept of a "onChange" events and when it came to the code which fetches changes from the server, there were multiple ways of handling that - from using polling, to using message queues to using db triggers, from using plain socket calls etc. And also very sophisticated applications with literally 100s of screens - example: plane/hotel ticketing apps, stock trading applications, ERP/MRP software etc, have all existed for decades.

munificent 3y ago

> applications with a lot of UI state with dozens of forms (screens) etc. How many of them had these convoluted ideas of state vs stateless widgets, watch, notifiers etc? Consider examples like Visual Basic, Delphi etc. ... The GUI components would be aware when their state changed and would update its own display. I wrote and maintained a lot of large GUI applications in that style during that time, as well as building a couple of GUI frameworks that operated that way. It's fine for a while and as long as the UI is fairly static and there's mostly a 1:1 mapping between pieces of data and UI that shows it. But it scales horribly once you find yourself in a situation where you have lots of computed model data, or model data that is shown in many places in the UI, or a highly flexible UI that changes a lot. You end up in a sprawling mess of event handlers, orphaned bits of UI that aren't on screen but are still inadvertently listening to events, zombie UI that forgot to register an event handler and isn't updating, computer model state that for now good reason lives inside one random button, and then other UI code that is pulling that state from that button and breaks if the button isn't on screen, etc. The reactive style / immediate mode style where you essentially redraw the entire UI based on the current model state is so much simpler and cleaner. Yes, state management can still be weird, but that's because mutable state is hard. There's no silver bullet.

pkphilip 3y ago
How often do you show multiple screens open to a user at the same time? Even in desktop ERP type software you rarely ever show more than 3 to 4 screens open at a time and how often do these screens all show the EXACT SAME data fields? How often do you show more than one screen open at a time in a mobile app? How often would you then need to display the same data field in multiple screens? I think the state management in mobile apps is extremely over engineered for a use case that rarely ever happens.
- munificent 3y ago
  Imagine you have a list of items. The list supports multiple selection. Elsewhere on the screen, you have a little box that shows the number of selected items, and the total order price of all of them. Elsewhere, there is an alert that shows up if the total order price is greater than some budget field. There is a button to order the selected items. The button should be disabled if the total price is greater than the budget. The budget amount is also a field that can be edited. First off, you have to decide where the selection itself is stored. Is whether or not an item is selected "model" state? Or "view model"? If the latter, is there a well defined place where that kind of data is stored or does it literally just list in the list UI element itself? If so, how do all of the other UI elements that need that state get it? Are they directly coupled to the list box? If a user selects "undo" does that change the selection? Is selecting or unselecting an item and undoable operation or not? If the back-end server sends an update that some item is no longer available, does the UI handle that appropriately? When the budget number changes, where does the validation logic to ensure the user chooses a reasonable number live? This is just a very simple example, but stuff like this comes up all the time and gets gnarly real fast.
  - pkphilip 3y ago
    I have handled far more complex cases than this using desktop based GUI apps in a client-server model before the word AJAX etc was even invented. Example: dependent dropdowns or even tables with row-selection leading to more detailed views. The ability to display multiple views for the same data type at the same point - example: displaying orders from multiple clients simultaneously in two different sub-screens at the same time. Also, MVC as a concept has existed for decades. GUI controls have always had a concept of a "onChange" events and when it came to the code which fetches changes from the server, there were multiple ways of handling that - from using polling, to using message queues to using db triggers, from using plain socket calls etc. And also very sophisticated applications with literally 100s of screens - example: plane/hotel ticketing apps, stock trading applications, ERP/MRP software etc, have all existed for decades.