diff --git a/packages/webaudio/webaudio.mjs b/packages/webaudio/webaudio.mjs
index 9da5a411d..8f18d80dc 100644
--- a/packages/webaudio/webaudio.mjs
+++ b/packages/webaudio/webaudio.mjs
@@ -58,7 +58,9 @@ export async function renderPatternAudio(
   });
   logger('[webaudio] preloading');
 
-  let haps = pattern.queryArc(begin, end, { _cps: cps });
+  let haps = pattern
+    .queryArc(begin, end, { _cps: cps })
+    .sort((a, b) => a.whole.begin.valueOf() - b.whole.begin.valueOf());
 
   for (const hap of haps) {
     if (hap.hasOnset()) {