> If WebGL takes the whole page with it when it crashes, that's kind of on the browser to fix.
On the contrary, it's on the Farm team to fix. It seems their front page has only one error boundary, which is why the chart component crashing takes the whole page down. This is fixed by simply wrapping the chart component in its own error boundary. That way React doesn't unmount practically the whole page when that component throws an error.
Oh, I thought you were talking about the actual browser process crashing. But seriously, are you saying that in React, a child component that throws an error during render will kill the parent's render too? That's wacky. I do Vue for a living, which doesn't behave anything like that.
But anyway, the chart looks like regular DOM to me. The canvas is actually in the top navbar, but I don't see anything drawn on it.
Since people in the early days of React would ignore errors thrown by components (or the React library itself) and constantly run into literal undefined behavior, React eventually adopted a behavior where it unmounts the VDOM to catch the developer's attention.[0] When a component throws an error, React will unmount to the nearest error boundary. By default, this is the root of the tree. You can control how much gets unmounted with error boundaries.
I've never used Vue so I have no idea how error handling works there, but React also offers programmatic ways to recover from errors (e.g. error boundaries can retry rendering the failed component with different state or props). Doesn't sound strange to me.
In Vue, if a component's setup or render functions crash, the component and its children just don't render and the parent is unaffected. It doesn't unmount components that crash later either. I guess that means Vue has an implicit error boundary around every component, and if you want different behavior, you set the errorCaptured hook to do something else.
On the contrary, it's on the Farm team to fix. It seems their front page has only one error boundary, which is why the chart component crashing takes the whole page down. This is fixed by simply wrapping the chart component in its own error boundary. That way React doesn't unmount practically the whole page when that component throws an error.