7 ms·

> This page crashed. > > Error creating WebGL context. I'm sorry, but WebGL probably shouldnt be a requirement for your front page to display any content at al

> This page crashed. > > Error creating WebGL context. I'm sorry, but WebGL probably shouldnt be a requirement for your front page to display any content at all. I disable it for privacy hardening and switch browsers to opt-in. Additionally, low-power clients may struggle with rendering and sink battery in mobile devices. The docs work fine, if anyone else runs into this and wants to read about the project. https://www.farmfe.org/docs/why-farm https://www.farmfe.org/docs/why-farm

chuckadams 2y ago
Minus the bar charts, the site works fine with JS disabled. If WebGL takes the whole page with it when it crashes, that's kind of on the browser to fix. Having a hard time even seeing what WebGL is used for on that page though: there's a canvas tag in the menubar, but it doesn't seem to be used for anything.
- koito17 2y ago
  > 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.
  - chuckadams 2y ago
    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.
    - FireInsight 2y ago
      Yeah, the error message I posted is rendered into the DOM by the web framework.
    - koito17 2y ago
      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. [0] https://legacy.reactjs.org/docs/error-boundaries.html https://legacy.reactjs.org/docs/error-boundaries.html
      - chuckadams 2y ago
        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.

chuckadams 2y ago

Minus the bar charts, the site works fine with JS disabled. If WebGL takes the whole page with it when it crashes, that's kind of on the browser to fix. Having a hard time even seeing what WebGL is used for on that page though: there's a canvas tag in the menubar, but it doesn't seem to be used for anything.

koito17 2y ago
> 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.
- chuckadams 2y ago
  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.
  - FireInsight 2y ago
    Yeah, the error message I posted is rendered into the DOM by the web framework.
  - koito17 2y ago
    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. [0] https://legacy.reactjs.org/docs/error-boundaries.html https://legacy.reactjs.org/docs/error-boundaries.html
    - chuckadams 2y ago
      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.