I just finished a project that uses ASP.NET MVC, jQuery and jQueryUI. One of the pages I wrote is still bugging me because I ended up writing a lot of client-side code for event handlers and it grew out of control due to the complexity of the interactions of the controls on the page and their states (the page is very interactive and has a google docs feel to it). My question is what best practices are available for client-side development (specifically using jQuery & jQueryUI) that have complex interactions (like google docs or yahoo’s mail client)? My biggest complaint I had with my code is that for almost all my event handlers, I ended up writing a lot of if statements that executed code based on the states of other controls on the page. It seems like there has to be a way to handle this in a more controlled manner.
Share
In general, the more modular you make things the easier it will be to put together a complex application. Break things down in to discrete components that do just one thing (single responsibility) and have clearly defined APIs to interact with other parts of the system. It sounds simple in theory but, in practice, you really need to put a lot of thought in to the architecture of your app before you get started writing any code.
John Papa’s course on Single Page Applications is a good place to start.