LinkedIn Frontend Engineer System Design Questions

For LinkedIn's notification system, we need to design a Debounced EventEmitter that prevents rapid firing of events when notifications are updated. The debounce should wait a specified time period before invoking the callback for the latest event.Class Signature:
- class DebouncedEventEmitter {
- emit(event: string, data: any): void;
- on(event: string, callback: Function): void;
- constructor(delay: number);
- }Example 1:
- Initialize an event emitter with a 200ms debounce: const emitter = new DebouncedEventEmitter(200).
- Call emitter.on('notify', (data) => console.log(data)); and emitter.emit('notify', 'You have a new message!'), it should log once after 200ms of inactivity.Constraints:
- The debounce should correctly handle multiple calls to emit within the specified delay.

With the requirement of an efficient and performant navigation system within LinkedIn's Single Page Application (SPA), design a client-side router that will help manage the navigation state and URL changes without refreshing the entire page.Class Signature:
- class Router {
- constructor(routes: Map<string, Function>);
- navigate(url: string): void;
- on(url: string, handler: Function): void;
- }Example 1:
- Initialize a Router with routes: const router = new Router(new Map([['/', () => 'Home'], ['/profile', () => 'Profile']]))
- Call router.navigate('/') should call the handler for home and update the view accordingly.Constraints:
- The Router should ensure that handlers for routes are invoked in order and each URL is associated with a specific view.
- Only allow paths as keys in the routes Map.
- Max 100 routes can be registered at a time.