What bundle of technologies should be used for a browser game?

Question

Highload

I have been studying web programming for a little over a year, and more specifically, developing a browser game. Until now, I have been developing with the following technology stack:

1. 1) Frontend: jquery
   
2. 2) Backend: yii2, redis, nodejs, websockets, pjax
   

Specifically, I didn’t bother with the frontend at all, rather delved into the features of developing various animations, optimizing the loaded layout, etc., in general, I became a css, html, svg, canvas guru, but did not delve into the world of modern javascript technologies and banal jquery. Until it came to working with the server, everything suited me.
With the backend, everything is a little more complicated. All pages were basically generated directly in yii2 and given to the user. Next, the user connected using websockets to the nodejs server and subscribed to a specific event branch. All requests for some action were usually sent via ajax to yii2. That is, if some event happened (yii2 received someone's request, say a chat message) and it was necessary to update information for some users, then yii2 sent information about this event to redis, and nodejs picked up this event from there and sent it to all subscribed on it to users.
The transition between pages was carried out using pjax.
In general, now I began to realize that this is an extremely dubious scheme of work for a dynamic browser game. The speed of switching pages and loading content is highly questionable.
In terms of the front-end, I’m currently considering react.js, since I would like to entrust the work of generating views entirely to users and offload the server as much as possible, and at the same time this will help unify the rendering of new and updated content, since now I have to rewrite the same thing 2 times for the content that was before entering the application (generated on yii2) and updated (generated by jquery on a websocket event).
But in terms of the backend, I still have very little idea in which direction I should move. I want to completely transfer all interactions with the server to web sockets and probably nodejs. But in this case, I absolutely do not understand how I can send the initial html "set" from links to css and js files and the site skeleton. I do not understand how to organize user authorization and interaction with the database. Won't there be problems with nodejs async? What can be pitfalls? How to structure nodejs server code? Are there any frameworks for such tasks?
Maybe there are some other technology stacks for such tasks?

Answer 1

But in this case, I absolutely do not understand how I can send the initial html "set" from links to css and js files and the site skeleton.

nodejs works great as an engine for normal websites.

app.get('/', (req, res) => res.send('./index.html'))

Well, except that for speed it is worth distributing statics with nginx.
If we are talking about server rendering of React, then see the relevant documentation.
sequilize.js or Mongoose, Passport.js for authorization
express.js/koa, kraken.js, sails.js. express does not provide any structure, so look for boilerplates.