web-debugger: Development Log
The idea is, spliting the UI into many different parts, and everything are connected together via an event system, components communicate by passing around messages. By doing this, I can add or remove any component at anytime without breaking the whole thing.
In order to do so, I need an Event System, it's fun (and trivial) to build one from scratch.
When I finished the Event System, the first thing I tried to consolidate is the Editor. Simply because this is the most critical part in the debugger, as it has the direct connection with the Debugging process (feed the code to the debugger, reflects on the state change of the debugger,...).
Thing goes pretty well and the whole refactoring process is not as complex as I initial thought. In fact, the use of Event System make it very easy to consolidate things in the initial prototype into smaller components.
The following diagram show the communication flow between each components using the Event System: