Is it possible to attach the original image data to the texture

Nobody has claimed this yet.

## Motivation

This allows mapbox to better integrate with regl or other GL class libraries，It looks like this:
```js
this.command = this.regl({
frag: `precision mediump float;
varying vec2 v_texCoord;
uniform sampler2D u_image;
void main() {
vec4 color = texture2D(u_image, v_texCoord);
gl_FragColor = color;
}`,

vert: `attribute vec2 a_pos;
uniform mat4 u_matrix;
varying vec2 v_texCoord;
float extent = 4096.0 * 2.0;
void main() {
vec4 a = u_matrix * vec4(a_pos * extent, 0, 1);
gl_Position = vec4(a.rgba);
v_texCoord = a_pos;
}`,

attributes: {
a_pos: [0, 0, 1, 0, 0, 1, 0, 1, 1, 0, 1, 1]
},

uniforms: {
u_matrix: this.regl.prop('u_matrix'),
u_image: this.regl.prop('u_image'),
},

depth: {
enable: true,
// mask: true,
func: 'less',
// range: [0, 1]
},

blend: {
enable: true,
func: {
srcRGB: 'one minus src alpha',
srcAlpha: 1,
dstRGB: 'one minus src alpha',
dstAlpha: 1
},
// color: [0, 0, 0, 0]
},

count: 6
});

const tiles = this.sourceCache.getVisibleCoordinates().map(tileid => this.sourceCache.getTile(tileid));
if (this.command) {
tiles.forEach(tile => {
if (!tile.texture) return;

// const imageData = createImageFromTexture(gl, tile.texture.texture, tile.texture.size[0], tile.texture.size[1]);

this.command({
u_matrix: tile.tileID.posMatrix,
// uTexture: tile.texture.texture
u_image: this.regl.texture({
data: tile.texture.image,
wrapS: 'clamp',
wrapT: 'clamp',
min: 'linear',
mag: 'linear',
mipmap: true,
width: tile.texture.size[0],
height: tile.texture.size[1],
}),
});
});
}
```

## Link to Demonstration
gl: https://codepen.io/sakitam-fdd/pen/qBaNppV
regl: https://codepen.io/sakitam-fdd/pen/GRjqxmm

## Design Alternatives
Adding an image to an instance in this class basically does not break existing functionality

[link](https://github.com/mapbox/mapbox-gl-js/blob/main/src/render/texture.js#L47)

```js
// @flow

import window from '../util/window';
const {HTMLImageElement, HTMLCanvasElement, HTMLVideoElement, ImageData, ImageBitmap} = window;

import type Context from '../gl/context';
import type {RGBAImage, AlphaImage} from '../util/image';

export type TextureFormat =
| $PropertyType
| $PropertyType;
export type TextureFilter =
| $PropertyType
| $PropertyType
| $PropertyType;
export type TextureWrap =
| $PropertyType
| $PropertyType
| $PropertyType;

type EmptyImage = {
width: number,
height: number,
data: null
}

export type TextureImage =
| RGBAImage
| AlphaImage
| HTMLImageElement
| HTMLCanvasElement
| HTMLVideoElement
| ImageData
| EmptyImage
| ImageBitmap;

class Texture {
context: Context;
size: [number, number];
texture: WebGLTexture;
image: TextureImage; // @tip: add
format: TextureFormat;
filter: ?TextureFilter;
wrap: ?TextureWrap;
useMipmap: boolean;

constructor(context: Context, image: TextureImage, format: TextureFormat, options: ?{ premultiply?: boolean, useMipmap?: boolean }) {
this.context = context;
this.format = format;
this.texture = context.gl.createTexture();
this.update(image, options);
}

update(image: TextureImage, options: ?{premultiply?: boolean, useMipmap?: boolean}, position?: { x: number, y: number }) {
const {width, height} = image;
const resize = (!this.size || this.size[0] !== width || this.size[1] !== height) && !position;
const {context} = this;
const {gl} = context;
this.image = image; // @tip: add

this.useMipmap = Boolean(options && options.useMipmap);
gl.bindTexture(gl.TEXTURE_2D, this.texture);

context.pixelStoreUnpackFlipY.set(false);
context.pixelStoreUnpack.set(1);
context.pixelStoreUnpackPremultiplyAlpha.set(this.format === gl.RGBA && (!options || options.premultiply !== false));

if (resize) {
this.size = [width, height];

if (image instanceof HTMLImageElement || image instanceof HTMLCanvasElement || image instanceof HTMLVideoElement || image instanceof ImageData || (ImageBitmap && image instanceof ImageBitmap)) {
gl.texImage2D(gl.TEXTURE_2D, 0, this.format, this.format, gl.UNSIGNED_BYTE, image);
} else {
gl.texImage2D(gl.TEXTURE_2D, 0, this.format, width, height, 0, this.format, gl.UNSIGNED_BYTE, image.data);
}

} else {
const {x, y} = position || {x: 0, y: 0};
if (image instanceof HTMLImageElement || image instanceof HTMLCanvasElement || image instanceof HTMLVideoElement || image instanceof ImageData || (ImageBitmap && image instanceof ImageBitmap)) {
gl.texSubImage2D(gl.TEXTURE_2D, 0, x, y, gl.RGBA, gl.UNSIGNED_BYTE, image);
} else {
gl.texSubImage2D(gl.TEXTURE_2D, 0, x, y, width, height, gl.RGBA, gl.UNSIGNED_BYTE, image.data);
}
}

if (this.useMipmap && this.isSizePowerOfTwo()) {
gl.generateMipmap(gl.TEXTURE_2D);
}
}

bind(filter: TextureFilter, wrap: TextureWrap, minFilter: ?TextureFilter) {
const {context} = this;
const {gl} = context;
gl.bindTexture(gl.TEXTURE_2D, this.texture);

if (minFilter === gl.LINEAR_MIPMAP_NEAREST && !this.isSizePowerOfTwo()) {
minFilter = gl.LINEAR;
}

if (filter !== this.filter) {
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MAG_FILTER, filter);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_MIN_FILTER, minFilter || filter);
this.filter = filter;
}

if (wrap !== this.wrap) {
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_S, wrap);
gl.texParameteri(gl.TEXTURE_2D, gl.TEXTURE_WRAP_T, wrap);
this.wrap = wrap;
}
}

isSizePowerOfTwo() {
return this.size[0] === this.size[1] && (Math.log(this.size[0]) / Math.LN2) % 1 === 0;
}

destroy() {
const {gl} = this.context;
gl.deleteTexture(this.texture);
this.texture = (null: any);
this.image = (null: any);
}
}

export default Texture;
```

## Design

### Mock-Up

### Concepts

### Implementation

Start with src/render/texture.js, especially the Texture constructor, update method, and destroy method shown in the issue. Determine how the original image should remain accessible without changing existing texture behavior. Done means the texture exposes its source image for external regl or WebGL use and remains compatible with current updates and cleanup.

Written by the indexing model from the issue text.