riki/rkgk
riki/rkgk
1
Fork 0
Code Issues 55 Pull requests Projects 1 Activity

optimizing loading times

Browse source 
- reducing the waterfall for JavaScript
- making the throbber appear properly if not all CSS is loaded; fonts.css and index.css are made non render-blocking
This commit is contained in:
りき萌 2025-06-26 19:17:06 +02:00
parent b4acab2c9c
commit f78f3136d9
1 changed files with 12 additions and 2 deletions
Download patch file Download diff file Expand all files Collapse all files

14
template/index.hbs.html
View file

@ -7,8 +7,6 @@
<title>rakugaki</title> <title>rakugaki</title>
<link rel="stylesheet" href="{{ static 'base.css' }}"> <link rel="stylesheet" href="{{ static 'base.css' }}">
<link rel="stylesheet" href="{{ static 'fonts.css' }}">
<link rel="stylesheet" href="{{ static 'index.css' }}">
<meta name="viewport" content="width=device-width, initial-scale=1"> <meta name="viewport" content="width=device-width, initial-scale=1">
@ -27,13 +25,20 @@
import "rkgk/brush-editor.js"; import "rkgk/brush-editor.js";
import "rkgk/brush-preview.js"; import "rkgk/brush-preview.js";
import "rkgk/canvas-renderer.js"; import "rkgk/canvas-renderer.js";
import "rkgk/code-editor.js";
import "rkgk/connection-status.js"; import "rkgk/connection-status.js";
import "rkgk/context-menu.js";
import "rkgk/framework.js"; import "rkgk/framework.js";
import "rkgk/haku.js";
import "rkgk/online-users.js";
import "rkgk/painter.js";
import "rkgk/random.js";
import "rkgk/resize-handle.js"; import "rkgk/resize-handle.js";
import "rkgk/reticle-renderer.js"; import "rkgk/reticle-renderer.js";
import "rkgk/session.js"; import "rkgk/session.js";
import "rkgk/throbber.js"; import "rkgk/throbber.js";
import "rkgk/viewport.js"; import "rkgk/viewport.js";
import "rkgk/wall.js";
import "rkgk/welcome.js"; import "rkgk/welcome.js";
import "rkgk/zoom-indicator.js"; import "rkgk/zoom-indicator.js";
@ -55,6 +60,11 @@
</head> </head>
<body> <body>
<!-- We shouldn't consider these stylesheets render-blocking.
About the only render-blocking thing on the page is the throbber. -->
<link rel="stylesheet" href="{{ static 'fonts.css' }}">
<link rel="stylesheet" href="{{ static 'index.css' }}">
<main> <main>
<rkgk-canvas-renderer class="fullscreen"></rkgk-canvas-renderer> <rkgk-canvas-renderer class="fullscreen"></rkgk-canvas-renderer>
<rkgk-reticle-renderer class="fullscreen"></rkgk-reticle-renderer> <rkgk-reticle-renderer class="fullscreen"></rkgk-reticle-renderer>