3.0.1 differs from 2.0.5 when speak is placed in useCallback...
Opened this issue · 1 comments
This gist https://gist.github.com/jerryasher/d3ed5d979b3ca9cc6daade3dd82493b2 contains the package.json and App.js of a create-react-app whose behavior changes between react-speech-kit 2.0.5 and 3.0.1
Namely, speak works in 2.0.5 when placed in useCallback and doesn't work in 3.0.1 I encountered this in a tutorial written for 2.0.5 that wouldn't work for me in 3.0.1. App.js is my attempt at boiling the issue down into a simple react hooks app using react-speech-kit
A useEffect causes it to render 4 times a second. A second useEffect tries, every 5 seconds, to speak the seconds. There are buttons to start and stop the speaking.
The basic issue that I am trying to solve is how to place speak within a useEffect in a way that lets speak work, and keeps react from calling that useEffect 60 times a second on each render as "speak" changes when useSpeechSynthesis is called.
My understanding is the standard solution is to place speak in a useCallback to return a memoized version (named doSpeak in the example)
So I don't know if the problem is in react-speech-kit or in how I am trying to use it, and since I'm such a noob, I wouldn't be surprised if it were the latter.
And I don't really know the proper syntax for calling useCallback, the reference is woeful on specifics that way
At any rate, this seems to work on 2.0.5 and not on 3.0.1, and I would appreciate any insights you have
Found the same thing. In v3.0.1 "speak" works fine when called directly, but when I call it like so "useCallback((...props) => speak(...props)) it doesn't. "speak" works fine with useCallback in v2.0.5.