Fix the extended_material example on WebGL2

[Henauxg]

Objective

• Fixes Extended material example fails in browser #13872 (also mentioned in Multiple examples don't work on 0.15 #17167)

Solution

Replaced the u32 field in MyExtension by a UVec4 and only use the x coordinate.

Alternatives

1- Separate conditional padding field

We can also add conditional padding to both structs:

// ... In extended_material.rs

struct MyExtension {
  #[uniform(100)]
  quantize_steps: u32,
  // WebGL2 structs must be 16 byte aligned.
  #[cfg(all(feature = "webgl2", target_arch = "wasm32", not(feature = "webgpu")))]
  #[uniform(100)]
   _webgl2_padding: Vec3,
}

// ... In extended_material.wgsl

struct MyExtendedMaterial {
   quantize_steps: u32,
#ifdef SIXTEEN_BYTE_ALIGNMENT
   // WebGL2 structs must be 16 byte aligned.
   _webgl2_padding: vec3,
#endif
}

EDIT: this alternative works fine too

2- Don't fix it, unlist it

While the fix is quite simple, it does muddy the waters a tiny bit due to quantize_steps now being a UVec4 instead of a simple u32. We could simply remove this example from the examples that support WebGL2.

Testing

• Ran the example locally on WebGL2 (and native Vulkan) successfully

[mate-h]

As evidenced by other parts of the Bevy codebase, we prefer to use this type of pattern to address alignment issues:

bevy/crates/bevy_gizmos/src/lib.rs

Line 506 in 6f3ea06

_padding: bevy_math::Vec3,

[mate-h]

Suggested change

	quantize_steps: vec4<u32>,
	quantize_steps: u32,
	#ifdef SIXTEEN_BYTE_ALIGNMENT
	_padding: vec3<u32>,
	#endif

[mate-h]

Some maintainers mentioned we should try to stay away from conditional compilation, if this is not the pattern we should be following anymore we should update the other examples to the simpler version too, or create a backlog task in the issues.

[Henauxg]

I'm fine with both approaches (the proposed one and the first alternative). And even the mix of both (adding a separate padding field with no conditional compilation).
If you look at all the existing the examples, it's mostly conditional padding fields with sometimes a vec3, sometimes 3 f32 fields and other variations.

As far as the examples go, my personal vote would go to a padding field without conditional compilation (in rust and WGSL) + a comment to mention the WebGL2 special requirement.

[mate-h]

Thats a very good suggestion I like it! Add a separate padding field but no conditional compilation clutter.