MNTOR-1171: Code Splitting #2987
Conversation
There was a problem hiding this comment.
The changes look good, and I'm looking forward to that darned error being prevented from now on!
I wonder, while we're in conflictopalooza, and if it's not too much work, if you could also adjust the controller file paths to align with their routes? So that have e.g. /src/controllers/api/v1/requestBreachScan.js instead of /src/controllers/requestBreachScan.js. I have some minor but consistent struggles to find the right controller, esp. distinguishing between backend and frontend routes. But if that gets you too deep in the weeds, then never mind, we can deal with it some other time.
| @@ -2,8 +2,10 @@ | |||
| * License, v. 2.0. If a copy of the MPL was not distributed with this | |||
| * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ | |||
|
|
|||
| /* Import global styles that apply to every page. | |||
| * Partial-specific stylesheets are auto-loaded based on filename and should not be added here */ | |||
|
I've noticed that Monitor sends |
| @@ -42,6 +42,7 @@ const mainLayout = data => ` | |||
| <link rel='apple-touch-icon' href='/images/apple-touch-icon.webp' sizes='180x180'> | |||
|
|
|||
| <script src='/js/index.js' type='module'></script> | |||
| ${data.skipPartialModule ? '' : `<script src='/js/partials/${data.partial.name}.js' type='module'></script>`} | |||
There was a problem hiding this comment.
suggestion (non-blocking): If we do include a specific script for a partial, is it pretty safe to say that a page does not work without it? Should we add a note to pages (the dashboard for example) that are impacted by JS being disabled?
There was a problem hiding this comment.
@flozia do you mean accommodating no-script users? I think it could be helpful for promotion pages (Landing for ex), but if script is disabled for landing, the newly added form simply doesn't work – the entire rest of the page should still function as a promo page sharing content. Perhaps we could audit the site with script turned off to see what the impact is – at a certain point (past the landing) our site is just not usable without script...
Thanks @groovecoder for pointing this out – I've added this as a separate ticket with high-priority. |
@Vinnl I love this idea. I think @mansaj has been primarily adding API files, I wonder if there's anything additional to consider? In effort to get this PR in before new devs start working on Monday, I'll merge this now and create a separate ticket for the API path matching and cc you. |
References:
Jira: MNTOR-1171
Description
Currently, client-side javascript files are all bundled and loaded for every page regardless of need.
Example: on Landing page, we currently load a bundle that includes Landing page-specific script and site-wide scripts, as well as unnecessary scripts from Breaches page and Settings page.
This PR aims to separate global modules used for every page from page-specific modules that should be loaded as-needed.
TODO:
use dynamic import toauto-load page-specific modulesHow to test
Regression testing on every page
Checklist (Definition of Done)