[Bug 36674] New: Lazy load api-client JS files
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Bug ID: 36674 Summary: Lazy load api-client JS files Change sponsored?: --- Product: Koha Version: unspecified Hardware: All OS: All Status: NEW Severity: enhancement Priority: P5 - low Component: Architecture, internals, and plumbing Assignee: koha-bugs@lists.koha-community.org Reporter: jonathan.druart@gmail.com QA Contact: testopia@bugs.koha-community.org js/fetch/api-client.js is fetching all the api-client.js files every time a page is hit in Koha. We should lazy-load instead. Certainly using import()? https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/... -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- See Also| |https://bugs.koha-community | |.org/bugzilla3/show_bug.cgi | |?id=33024 -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Pedro Amorim <pedro.amorim@ptfs-europe.com> changed: What |Removed |Added ---------------------------------------------------------------------------- CC| |pedro.amorim@ptfs-europe.co | |m -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Paul Derscheid <paul.derscheid@lmscloud.de> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|NEW |Needs Signoff -- You are receiving this mail because: You are watching all bug changes. You are the assignee for the bug.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #1 from Paul Derscheid <paul.derscheid@lmscloud.de> --- Created attachment 186551 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=186551&action=edit Bug 36674: Lazy-load intranet API clients via proxy Replaced the eager imports in the intranet APIClient aggregator with lazy proxies so individual client modules are only fetched the first time they are actually used. Documented the pattern in the createClientProxy JSDoc, and kept the legacy synchronous API intact by forwarding property access, method calls, and promise chaining. The Vue aggregator remains on static imports for now because the rspack bundles already would handle chunking (which we need to configure) and would require broader consumer changes. This is a bit hacky, but only touches the api-client itself, which I like. Otherwise we would have to adjust all consumers. Test plan: 1. Log in to the staff interface and visit Admin → System preferences. 2. Open DevTools, Network tab, and enable “Disable cache”. 3. Trigger an API call (e.g. edit a preference and click “Save”, or run await APIClient.sysprefs.sysprefs.update_all({}).catch(()=>{}); from the console). 4. Confirm a new request for js/fetch/system-preferences-api-client.js appears and the page still behaves as before. 5. Theoretically we would need to test all call sites.. 6. Sign-off -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Needs Signoff |Signed Off -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #186551|0 |1 is obsolete| | --- Comment #2 from Jonathan Druart <jonathan.druart@gmail.com> --- Created attachment 186616 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=186616&action=edit Bug 36674: Lazy-load intranet API clients via proxy Replaced the eager imports in the intranet APIClient aggregator with lazy proxies so individual client modules are only fetched the first time they are actually used. Documented the pattern in the createClientProxy JSDoc, and kept the legacy synchronous API intact by forwarding property access, method calls, and promise chaining. The Vue aggregator remains on static imports for now because the rspack bundles already would handle chunking (which we need to configure) and would require broader consumer changes. This is a bit hacky, but only touches the api-client itself, which I like. Otherwise we would have to adjust all consumers. Test plan: 1. Log in to the staff interface and visit Admin → System preferences. 2. Open DevTools, Network tab, and enable “Disable cache”. 3. Trigger an API call (e.g. edit a preference and click “Save”, or run await APIClient.sysprefs.sysprefs.update_all({}).catch(()=>{}); from the console). 4. Confirm a new request for js/fetch/system-preferences-api-client.js appears and the page still behaves as before. 5. Theoretically we would need to test all call sites.. 6. Sign-off Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #3 from Jonathan Druart <jonathan.druart@gmail.com> --- Created attachment 186617 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=186617&action=edit Bug 36674: Remove duplication Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> -- You are receiving this mail because: You are watching all bug changes. You are the assignee for the bug.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #4 from Jonathan Druart <jonathan.druart@gmail.com> --- I have to admit I don't understand all what is doing the first patch but it's working very well! -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lisette Scheer <lisette@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- QA Contact|testopia@bugs.koha-communit |lisette@bywatersolutions.co |y.org |m CC| |lisette@bywatersolutions.co | |m Assignee|koha-bugs@lists.koha-commun |paul.derscheid@lmscloud.de |ity.org | -- You are receiving this mail because: You are the assignee for the bug. You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lisette Scheer <lisette@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Signed Off |Passed QA -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lisette Scheer <lisette@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #186617|0 |1 is obsolete| | --- Comment #5 from Lisette Scheer <lisette@bywatersolutions.com> --- Created attachment 186994 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=186994&action=edit Bug 36674: Remove duplication Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> Signed-off-by: Lisette Scheer <lisette@bywatersolutions.com> -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lisette Scheer <lisette@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #186616|0 |1 is obsolete| | --- Comment #6 from Lisette Scheer <lisette@bywatersolutions.com> --- Created attachment 186995 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=186995&action=edit Bug 36674: Lazy-load intranet API clients via proxy Replaced the eager imports in the intranet APIClient aggregator with lazy proxies so individual client modules are only fetched the first time they are actually used. Documented the pattern in the createClientProxy JSDoc, and kept the legacy synchronous API intact by forwarding property access, method calls, and promise chaining. The Vue aggregator remains on static imports for now because the rspack bundles already would handle chunking (which we need to configure) and would require broader consumer changes. This is a bit hacky, but only touches the api-client itself, which I like. Otherwise we would have to adjust all consumers. Test plan: 1. Log in to the staff interface and visit Admin → System preferences. 2. Open DevTools, Network tab, and enable “Disable cache”. 3. Trigger an API call (e.g. edit a preference and click “Save”, or run await APIClient.sysprefs.sysprefs.update_all({}).catch(()=>{}); from the console). 4. Confirm a new request for js/fetch/system-preferences-api-client.js appears and the page still behaves as before. 5. Theoretically we would need to test all call sites.. 6. Sign-off Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> Signed-off-by: Lisette Scheer <lisette@bywatersolutions.com> -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lisette Scheer <lisette@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Keywords| |release-notes-needed --- Comment #7 from Lisette Scheer <lisette@bywatersolutions.com> --- Thanks for all the notes in /koha-tmpl/intranet-tmpl/prog/js/fetch/api-client.js that'll be really helpful for future developers. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lucas Gass (lukeg) <lucas@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Passed QA |Patch doesn't apply CC| |lucas@bywatersolutions.com --- Comment #8 from Lucas Gass (lukeg) <lucas@bywatersolutions.com> --- We need a rebase here now. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Patch doesn't apply |Passed QA -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #186994|0 |1 is obsolete| | Attachment #186995|0 |1 is obsolete| | --- Comment #9 from Jonathan Druart <jonathan.druart@gmail.com> --- Created attachment 187826 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=187826&action=edit Bug 36674: Remove duplication Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> Signed-off-by: Lisette Scheer <lisette@bywatersolutions.com> -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #186995|1 |0 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #10 from Jonathan Druart <jonathan.druart@gmail.com> --- (In reply to Lucas Gass (lukeg) from comment #8)
We need a rebase here now.
Patches were applied in reserve order. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #11 from Jonathan Druart <jonathan.druart@gmail.com> --- (In reply to Lucas Gass (lukeg) from comment #8)
We need a rebase here now.
Patches were attached in reserve order. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lucas Gass (lukeg) <lucas@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Version(s)| |25.11.00 released in| | Status|Passed QA |Pushed to main -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #12 from Lucas Gass (lukeg) <lucas@bywatersolutions.com> --- Nice work everyone! Pushed to main for 25.11 -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #13 from Pedro Amorim <pedro.amorim@openfifth.co.uk> --- This appears to be causing the following warning when doing yarn js:watch WARNING in ./koha-tmpl/intranet-tmpl/prog/js/fetch/api-client.js ⚠ Module parse warning: ╰─▶ ⚠ Critical dependency: the request of a dependency is an expression ╭─[226:26] 224 │ key, 225 │ createClientProxy(function() { 226 │ return import(path); · ───── 227 │ }) 228 │ ]; ╰──── Rspack compiled with 1 warning in 1.01 s -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #14 from Jonathan Druart <jonathan.druart@gmail.com> --- Created attachment 188316 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=188316&action=edit Bug 36674: Fix warning WARNING in ./koha-tmpl/intranet-tmpl/prog/js/fetch/api-client.js ⚠ Module parse warning: ╰─▶ ⚠ Critical dependency: the request of a dependency is an expression ╭─[226:26] 224 │ key, 225 │ createClientProxy(function() { 226 │ return import(path); · ───── 227 │ }) 228 │ ]; ╰──── -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #15 from Jonathan Druart <jonathan.druart@gmail.com> --- Is this patch correct, Paul? https://webpack.js.org/guides/dependency-management/#requirecontext Seems a bit useless but it removes the warning. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #16 from Paul Derscheid <paul.derscheid@lmscloud.de> --- Looking. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #17 from Paul Derscheid <paul.derscheid@lmscloud.de> --- The problem was actually introduced by
Bug 36674: Remove duplication
The commit tried to DRY up the code by extracting paths into variables, using import(path) instead of import("./patron-api-client.js"). The problem is that webpack/rspack needs to see those literal strings at build time to know which files to bundle - when you use a variable, it can't figure that out until runtime. The fix is just to revert 3a6fe57c269367a3dfedee0720b0857314c77dbf. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #18 from Paul Derscheid <paul.derscheid@lmscloud.de> --- I think this was just a problem for the cypress entry point that actually bundles the thing. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #19 from Jonathan Druart <jonathan.druart@gmail.com> --- Created attachment 188326 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=188326&action=edit Bug 36674: Revert "Bug 36674: Remove duplication" This reverts commit 3a6fe57c269367a3dfedee0720b0857314c77dbf. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #188316|0 |1 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #20 from Lucas Gass (lukeg) <lucas@bywatersolutions.com> --- 3a6fe57c269367a3dfedee0720b0857314c77dbf is reverted from main now -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Keywords| |additional_work_needed --- Comment #21 from Jonathan Druart <jonathan.druart@gmail.com> --- We broke api-client.ts Oops...we found an error preparing this test file:
t/cypress/integration/t/api-client.ts
The error was: Error: Webpack Compilation Error Module parse failed: Unexpected token (1:10) You may need an appropriate loader to handle this file type, currently no loaders are configured to process this file. See https://webpack.js.org/concepts#loaders -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #22 from Paul Derscheid <paul.derscheid@lmscloud.de> --- Taking a look. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #23 from Paul Derscheid <paul.derscheid@lmscloud.de> --- Created attachment 189012 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=189012&action=edit Bug 36674: (follow-up) Stop emitting Cypress API client source maps - Use devtool: false to prevent emitting source maps for cypress. - Add package script to clean built assets, artifacts. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #24 from Paul Derscheid <paul.derscheid@lmscloud.de> --- Joubu, try the last patch, run yarn js:clean then rebuild, the error should be gone. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #25 from Jonathan Druart <jonathan.druart@gmail.com> --- + "js:clean": "find koha-tmpl/intranet-tmpl/prog/js/vue/dist -type f -name '*.js*' -delete && find t/cypress/plugins/dist -type f -name '*.js*' -delete", Why not `rm -rf koha-tmpl/intranet-tmpl/prog/js/vue/dist/* t/cypress/plugins/dist/*` ? The reason I am asking is that there is a subdir koha-tmpl/intranet-tmpl/prog/js/vue/dist/admin that will be left empty with the command you suggested. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #26 from Paul Derscheid <paul.derscheid@lmscloud.de> --- Oh, sorry. I overlooked that. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Paul Derscheid <paul.derscheid@lmscloud.de> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #189012|0 |1 is obsolete| | --- Comment #27 from Paul Derscheid <paul.derscheid@lmscloud.de> --- Created attachment 189153 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=189153&action=edit Bug 36674: (follow-up) Stop emitting Cypress API client source maps - Use devtool: false to prevent emitting source maps for cypress. - Add package script to clean built assets, artifacts. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #28 from Paul Derscheid <paul.derscheid@lmscloud.de> --- I often use find since I think it's more flexible if you want to keep some stuff but in this case it doesn't provide any benefit. -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #29 from Jonathan Druart <jonathan.druart@gmail.com> --- Created attachment 189551 --> https://bugs.koha-community.org/bugzilla3/attachment.cgi?id=189551&action=edit Bug 36674: (follow-up) Stop emitting Cypress API client source maps - Use devtool: false to prevent emitting source maps for cypress. - Add package script to clean built assets, artifacts. Signed-off-by: Jonathan Druart <jonathan.druart@bugs.koha-community.org> -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Jonathan Druart <jonathan.druart@gmail.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Attachment #189153|0 |1 is obsolete| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Lucas Gass (lukeg) <lucas@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Keywords|additional_work_needed | --- Comment #30 from Lucas Gass (lukeg) <lucas@bywatersolutions.com> --- follow-up pushed to main -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Laura Escamilla <Laura.escamilla@bywatersolutions.com> changed: What |Removed |Added ---------------------------------------------------------------------------- Status|Pushed to main |Needs documenting Version(s)|25.11.00 |25.11.00, 25.05.08 released in| | CC| |Laura.escamilla@bywatersolu | |tions.com --- Comment #31 from Laura Escamilla <Laura.escamilla@bywatersolutions.com> --- Backported to 25.05.08 -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 David Cook <dcook@prosentient.com.au> changed: What |Removed |Added ---------------------------------------------------------------------------- CC| |dcook@prosentient.com.au -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 Fridolin Somers <fridolin.somers@biblibre.com> changed: What |Removed |Added ---------------------------------------------------------------------------- CC| |fridolin.somers@biblibre.co | |m Version(s)|25.11.00, 25.05.08 |25.11.00,25.05.08 released in| | -- You are receiving this mail because: You are watching all bug changes.
https://bugs.koha-community.org/bugzilla3/show_bug.cgi?id=36674 --- Comment #32 from Fridolin Somers <fridolin.somers@biblibre.com> --- Enhancement not pushed to 24.11.x -- You are receiving this mail because: You are watching all bug changes.
participants (1)
-
bugzilla-daemon@bugs.koha-community.org