diff --git a/webgpu/lessons/webgpu-optimization.md b/webgpu/lessons/webgpu-optimization.md
index b42c96e7..87915295 100644
--- a/webgpu/lessons/webgpu-optimization.md
+++ b/webgpu/lessons/webgpu-optimization.md
@@ -60,7 +60,9 @@ in general.
 
 ```js
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({
+    powerPreference: 'high-performance',
+  });
   const device = await adapter?.requestDevice();
   if (!device) {
     fail('need a browser that supports WebGPU');
@@ -800,7 +802,9 @@ And we'll time our render pass
 
 ```js
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({
+    powerPreference: 'high-performance',
+  });
 -  const device = await adapter?.requestDevice();
 +  const canTimestamp = adapter.features.has('timestamp-query');
 +  const device = await adapter?.requestDevice({
diff --git a/webgpu/webgl-optimization-global-material-per-object-uniform-buffers.html b/webgpu/webgl-optimization-global-material-per-object-uniform-buffers.html
index 35875444..3ea39eb2 100644
--- a/webgpu/webgl-optimization-global-material-per-object-uniform-buffers.html
+++ b/webgpu/webgl-optimization-global-material-per-object-uniform-buffers.html
@@ -174,7 +174,11 @@
 
   // Get a WebGPU context from the canvas and configure it
   const canvas = document.querySelector('canvas');
-  const gl = canvas.getContext('webgl2');
+  const gl = canvas.getContext('webgl2', {
+    alpha: false,
+    antialias: false,
+    powerPreference: 'high-performance',
+  });
   const timingHelper = new TimingHelper(gl);
 
   const uniformBlock = `
diff --git a/webgpu/webgl-optimization-none-uniform-buffers.html b/webgpu/webgl-optimization-none-uniform-buffers.html
index ca8aba91..450c8f2a 100644
--- a/webgpu/webgl-optimization-none-uniform-buffers.html
+++ b/webgpu/webgl-optimization-none-uniform-buffers.html
@@ -173,7 +173,11 @@
 
   // Get a WebGPU context from the canvas and configure it
   const canvas = document.querySelector('canvas');
-  const gl = canvas.getContext('webgl2');
+  const gl = canvas.getContext('webgl2', {
+    alpha: false,
+    antialias: false,
+    powerPreference: 'high-performance',
+  });
   const timingHelper = new TimingHelper(gl);
 
   const uniformBlock = `
diff --git a/webgpu/webgl-optimization-none.html b/webgpu/webgl-optimization-none.html
index f68d4c27..b902f09e 100644
--- a/webgpu/webgl-optimization-none.html
+++ b/webgpu/webgl-optimization-none.html
@@ -173,7 +173,11 @@
 
   // Get a WebGPU context from the canvas and configure it
   const canvas = document.querySelector('canvas');
-  const gl = canvas.getContext('webgl2');
+  const gl = canvas.getContext('webgl2', {
+    alpha: false,
+    antialias: false,
+    powerPreference: 'high-performance',
+  });
   const timingHelper = new TimingHelper(gl);
 
   const vs = `#version 300 es
diff --git a/webgpu/webgl-optimization-uniform-buffers-one-large.html b/webgpu/webgl-optimization-uniform-buffers-one-large.html
index f1aefcac..f43c51fc 100644
--- a/webgpu/webgl-optimization-uniform-buffers-one-large.html
+++ b/webgpu/webgl-optimization-uniform-buffers-one-large.html
@@ -177,7 +177,11 @@
 
   // Get a WebGPU context from the canvas and configure it
   const canvas = document.querySelector('canvas');
-  const gl = canvas.getContext('webgl2');
+  const gl = canvas.getContext('webgl2', {
+    alpha: false,
+    antialias: false,
+    powerPreference: 'high-performance',
+  });
   const timingHelper = new TimingHelper(gl);
 
   const uniformBlock = `
diff --git a/webgpu/webgpu-optimization-none.html b/webgpu/webgpu-optimization-none.html
index cfecd80c..06932aca 100644
--- a/webgpu/webgpu-optimization-none.html
+++ b/webgpu/webgpu-optimization-none.html
@@ -105,7 +105,7 @@
 const randomArrayElement = arr => arr[Math.random() * arr.length | 0];
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step3-global-vs-per-object-uniforms.html b/webgpu/webgpu-optimization-step3-global-vs-per-object-uniforms.html
index 6705c431..242573a2 100644
--- a/webgpu/webgpu-optimization-step3-global-vs-per-object-uniforms.html
+++ b/webgpu/webgpu-optimization-step3-global-vs-per-object-uniforms.html
@@ -105,7 +105,7 @@
 const randomArrayElement = arr => arr[Math.random() * arr.length | 0];
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step4-material-uniforms.html b/webgpu/webgpu-optimization-step4-material-uniforms.html
index acacb750..d007e68e 100644
--- a/webgpu/webgpu-optimization-step4-material-uniforms.html
+++ b/webgpu/webgpu-optimization-step4-material-uniforms.html
@@ -105,7 +105,7 @@
 const randomArrayElement = arr => arr[Math.random() * arr.length | 0];
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step5-use-buffer-offsets.html b/webgpu/webgpu-optimization-step5-use-buffer-offsets.html
index 9b3e325c..e06ca7c0 100644
--- a/webgpu/webgpu-optimization-step5-use-buffer-offsets.html
+++ b/webgpu/webgpu-optimization-step5-use-buffer-offsets.html
@@ -108,7 +108,7 @@
 const roundUp = (v, alignment) => Math.ceil(v / alignment) * alignment;
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step6-use-mapped-buffers-dyanmic-offsets.html b/webgpu/webgpu-optimization-step6-use-mapped-buffers-dyanmic-offsets.html
index 3173092a..7e243abe 100644
--- a/webgpu/webgpu-optimization-step6-use-mapped-buffers-dyanmic-offsets.html
+++ b/webgpu/webgpu-optimization-step6-use-mapped-buffers-dyanmic-offsets.html
@@ -108,7 +108,7 @@
 const roundUp = (v, alignment) => Math.ceil(v / alignment) * alignment;
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step6-use-mapped-buffers-math-w-offsets.html b/webgpu/webgpu-optimization-step6-use-mapped-buffers-math-w-offsets.html
index 8f900b02..c1aebce1 100644
--- a/webgpu/webgpu-optimization-step6-use-mapped-buffers-math-w-offsets.html
+++ b/webgpu/webgpu-optimization-step6-use-mapped-buffers-math-w-offsets.html
@@ -665,7 +665,7 @@
 const roundUp = (v, alignment) => Math.ceil(v / alignment) * alignment;
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step6-use-mapped-buffers.html b/webgpu/webgpu-optimization-step6-use-mapped-buffers.html
index 42595485..a99130c0 100644
--- a/webgpu/webgpu-optimization-step6-use-mapped-buffers.html
+++ b/webgpu/webgpu-optimization-step6-use-mapped-buffers.html
@@ -108,7 +108,7 @@
 const roundUp = (v, alignment) => Math.ceil(v / alignment) * alignment;
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step7-double-buffer-2-submit.html b/webgpu/webgpu-optimization-step7-double-buffer-2-submit.html
index b0666c9e..b8e63175 100644
--- a/webgpu/webgpu-optimization-step7-double-buffer-2-submit.html
+++ b/webgpu/webgpu-optimization-step7-double-buffer-2-submit.html
@@ -108,7 +108,7 @@
 const roundUp = (v, alignment) => Math.ceil(v / alignment) * alignment;
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step7-double-buffer-typedarray-set.html b/webgpu/webgpu-optimization-step7-double-buffer-typedarray-set.html
index 38bb4564..7be07022 100644
--- a/webgpu/webgpu-optimization-step7-double-buffer-typedarray-set.html
+++ b/webgpu/webgpu-optimization-step7-double-buffer-typedarray-set.html
@@ -108,7 +108,7 @@
 const roundUp = (v, alignment) => Math.ceil(v / alignment) * alignment;
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [
diff --git a/webgpu/webgpu-optimization-step7-double-buffer.html b/webgpu/webgpu-optimization-step7-double-buffer.html
index c40dbb55..ad6c251d 100644
--- a/webgpu/webgpu-optimization-step7-double-buffer.html
+++ b/webgpu/webgpu-optimization-step7-double-buffer.html
@@ -108,7 +108,7 @@
 const roundUp = (v, alignment) => Math.ceil(v / alignment) * alignment;
 
 async function main() {
-  const adapter = await navigator.gpu?.requestAdapter();
+  const adapter = await navigator.gpu?.requestAdapter({powerPreference: 'high-performance'});
   const canTimestamp = adapter.features.has('timestamp-query');
   const device = await adapter?.requestDevice({
     requiredFeatures: [