Apple Frontend Engineer System Design Questions

Apple TV apps require a seamless client-side routing experience to manage different screens and URLs. You need to design a router that can manage multiple routes and render components based on the current URL.
Implement a class Router with the following methods:
- registerRoute(path: string, component: Function): void - Registers a new route with its corresponding component.
- navigate(path: string): void - Navigates to the given path and renders the associated component.Example 1:
Input: router.registerRoute('/home', HomeComponent); router.navigate('/home');
Output: HomeComponent is rendered on the screen.
Explanation: The corresponding component displays when the route matches.Constraints:
- 1 ≤ path length ≤ 100.
- 1 ≤ component count ≤ 100.

Apple Safari needs an efficient way to update the UI without re-rendering the entire DOM. Your task is to design an algorithm that can diff two virtual DOM trees and return the changes needed to update the real DOM.
Implement a function diff(oldTree: Node, newTree: Node): Array<Change> where Change is an object containing the type of change and the relevant node information.Example 1:
Input: diff(oldTree, newTree)
Output: [{ action: 'remove', node: oldNode }, { action: 'add', node: newNode }]
Explanation: Returns an array of changes needed to transform the old tree into the new tree.Constraints:
- 1 ≤ |oldTree|, |newTree| ≤ 10^3