Use iframes

[greggman]

This PR removes react and next. It allows a sample to be pure JavaScript (though there are none at the moment, all the samples are in typescript). It allows samples to be standalone so that they run separate from the sample selection menu. (which is how they are able to run in iframes).

Note: The last 4 PRs are not merged (they're overwritten). The 3 related to redirects, AFAICT, are irrelevant after this PR. The group descriptions I can add back but this is taking much longer than expect (Have spent ~30hrs) so crossing my fingers this is ok. Open to suggestions.

Note: Originally I had changed all of the xxx.wgsl files to xxx.wgsl.js and surrounded the shaders with

export default `
   ...wgsl...
`;

but I felt there were be resistance so I left it as is. We can revisit that. My issue with it is is it requires a build step and special rules. Of course typescript requires a build step too but if switch the .wgsl to .wgsl.js then all you need is typescript to build and run the examples. You don't need some bundler to hack the .wgsl files into includable files. That seems more useful for people wanting to use the samples elsewhere? OTOH the plugin to make it work is small in most build systems so I'm not 100 sure what I feel about that ATM.

[greggman]

there's a live version here: https://greggman.github.io/webgpu-samples-iframes/

[beaufortfrancois]

@greggman Can you make sure https://webgpu.github.io/webgpu-samples/samples/videoUploadingWebCodecs still redirects to https://webgpu.github.io/webgpu-samples/samples/videoUploading?videoSource=videoFrame?
See #367

[austinEng]

Navigation bar seems cut off on mobile when expanded

On the home page, the background doesn't extend all the way

[greggman]

fixed screenshots

[kainino0x]

My issue with it is is it requires a build step and special rules.

How about loading the shaders using fetch instead?

[greggman]

How about loading the shaders using fetch instead?

That doesn't seem very idiomatic. I'm only guessing most devs don't want a separate network request for each shader vs just strings in their script. import is a fetch but a bundler fixes that. I guess by that argument bundlers are common and so the small rule to use .wgsl files is not a big deal.

[austinEng]

this is a huge diff and I tried to look through most of the non-sample parts but may have missed things. I skimmed most of the existing webgpu code.

I think we may as well land it and follow-up on any improvements / changes since the high level structure probably won't change significantly.