webgl-component.js

class WebGL extends React.Component {
  state = {
    elements: [],
    renderer: null,
    scene: null
  };
  
  addImage = (image) => {
    //.. Create Image texture & push into webgl context
  }

  // We wrap everything in our Effect context provider
  render() {
    const { children } = this.props;
    const { elements, scene } = this.state;
    return (
      <EffectContext.Provider
        value={{
          elements: elements,
          scene: scene,
          addImage: this.addImage
        }}
      >
        {children}
        <WebGLRenderer />
      </EffectContext.Provider>
    );
  }
}