Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

SharedArrayBuffer will require cross-origin isolation as of M91, around May 2021

When creating a react app via npx create-react-app and running it, a warning pops up in DevTools (Chrome 88 and 89):

scheduler.development.js:298 [Deprecation] SharedArrayBuffer will require cross-origin isolation as of M91, around May 2021. See https://developer.chrome.com/blog/enabling-shared-array-buffer/ for more details.

Environment

  current version of create-react-app: 4.0.1
  running from /Users/mahdi/.npm/_npx/25767/lib/node_modules/create-react-app
  Binaries:
    Node: 14.15.4 - ~/.nvm/versions/node/v14.15.4/bin/node
    Yarn: 1.22.4 - /usr/local/bin/yarn
    npm: 6.14.10 - ~/.nvm/versions/node/v14.15.4/bin/npm
  Browsers:
    Chrome: 88.0.4324.96
    Edge: 87.0.664.66
    Firefox: 84.0
    Safari: 14.0.2
  npmPackages:
    react: ^17.0.1 => 17.0.1
    react-dom: ^17.0.1 => 17.0.1
    react-scripts: Not Found
  npmGlobalPackages:
    create-react-app: Not Found

enter image description here

Steps to reproduce

  1. npx create-react-app myapp
  2. cd myapp && npm start Open
  3. http://localhost:3000 in Chrome 88 or 89, regular or Incognito mode
  4. Open DevTools: the warning is displayed

Any suggestion for resolving this warning?

like image 483
MJBZA Avatar asked Mar 05 '21 08:03

MJBZA


3 Answers

Update the react and react-dom versions from 17.0.1 to ==> 17.0.2 could resolve this problem.

You just need to run npm update in the command prompt or bash, and hopefully you will see the changes in your package.json file. (yarn upgrade react --latest and yarn upgrade react-dom --latest if you want the upgrade to persist to the package.json)

Here is a git report from my app after applying the update:

image of git report

like image 51
MJBZA Avatar answered Nov 17 '22 05:11

MJBZA


As the warning shows, Chrome will require cross-origin isolation starting version 91 in order to use SharedArrayBuffer. As far as I know there is nothing you can do to resolve the warning other then wait for a react update.

Others are also having this issue as you can see here and here

The issue is fixed in this pull request but has not yet been released.

Edit: It is now fixed in version 17.0.2 of react.

like image 63
Rajohan Avatar answered Nov 17 '22 04:11

Rajohan


Actually after update react-dom to the latest version solved by me the problem, react alone did not solve it:

npm i react@latest react-dom@latest

OR

yarn add react@latest react-dom@latest
like image 10
bukso Avatar answered Nov 17 '22 03:11

bukso