All geek questions in one place

Animation preload for React webpack

I have one webapp page, which is about 300KB. It comes bundled with webpack and uses React / Redux.

How can I put a small boot counter up until the page is loaded? I can portray

  • set the style and css in static index.html
  • using an asynchronous loader like krux / postscribe
+4
source share
1 answer

One way is to insert a loading animation in index.html

eg.

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
    </head>
    <body>
        <div id="content">
            <div id="loader" />
        </div>
        <script src="build/app.js"></script>
    </body>
</html>

Then, after the bundle.js file loads, it will be displayed in the content, and the download animation will disappear.

EDIT:

webapp. https://developers.google.com/web/updates/2015/10/splashscreen

, . , , .

+5

Source: https://habr.com/ru/post/1628012/

More articles:


All Articles