RC: 1.3.8 (#78)

* Fix "memory access out of bounds" error (#77)

* Fix "memory access out of bounds" error

See rustwasm/wasm-bindgen#3153 for context

* Use useEffect

* hook: `useMountEffectOnce`

* version: 1.3.8

Co-authored-by: ivanschuetz <ivanschuetz@gmail.com>

package.json

@@ -1,6 +1,6 @@
 {
   "name": "nextjs-wasm",
-  "version": "1.3.7",
+  "version": "1.3.8",
   "scripts": {
     "dev": "next dev",
     "build:wasm": "wasm-pack build wasm --release --target web",

src/context/WASM.tsx

@@ -1,5 +1,6 @@
-import { ReactNode, useEffect, useState } from 'react'
-import { createContext } from 'react'
+import { useState, createContext } from 'react'
+import type { ReactNode } from 'react'
+import { useMountEffectOnce } from '../hooks/useMountEffectOnce'
 
 const initial: IWASMContext = {}
 
@@ -10,13 +11,16 @@ export const WASMContextProvider: React.FC<WASMContextProviderProps> = ({
 }) => {
   const [state, setState] = useState<IWASMContext>(initial)
 
-  useEffect(() => {
+  // This has to run only once: https://github.com/rustwasm/wasm-bindgen/issues/3153
+  // Though, in development React renders twice when Strict Mode is enabled: https://reactjs.org/docs/strict-mode.html
+  // That's why it must be limited to a single mount run
+  useMountEffectOnce(() => {
     (async() => {
-      const wasm = await import('wasm')
-      await wasm.default()
-      setState({ wasm })
+      const wasm = await import("wasm");
+      await wasm.default();
+      setState({ wasm });
     })()
-  }, [])
+  })
 
   return (
     <WASMContext.Provider value={state}>

src/hooks/useMountEffectOnce.ts

@@ -0,0 +1,11 @@
+import { useEffect, useRef } from 'react'
+
+export const useMountEffectOnce = (fn: () => void) => {
+  const wasExecutedRef = useRef(false)
+  useEffect(() => {
+    if (!wasExecutedRef.current) {
+      fn()
+    }
+    wasExecutedRef.current = true
+  }, [fn])
+}

wasm/Cargo.toml

@@ -1,6 +1,6 @@
 [package]
 name = "wasm"
-version = "1.3.7"
+version = "1.3.8"
 edition = "2021"
 
 # See more keys and their definitions at https://doc.rust-lang.org/cargo/reference/manifest.html