Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Add JS bundling and minification with Rollup #48

Draft
wants to merge 7 commits into
base: main
Choose a base branch
from

Conversation

mbehzad
Copy link
Contributor

@mbehzad mbehzad commented Feb 28, 2023

Add rollup for bundling and minification of javascript files. To reduce the number of requests and the response size and achieve a slightly better load performance.

Test URLs:

@aem-code-sync
Copy link

aem-code-sync bot commented Feb 28, 2023

Hello, I'm Franklin Bot and I will run some test suites that validate the page speed.
In case there are problems, just click the checkbox below to rerun the respective action.

  • Re-run PSI Checks

Sorry, something went wrong.

@aem-code-sync
Copy link

aem-code-sync bot commented Feb 28, 2023

Page Score PSI Audit Google
/ SI FCP LCP TBT CLS PSI

'./scripts/scripts.js',
// is already imported by script.js.
// There is no need to generate a bundle for it (ignoring 404.html)
// './scripts/lib-franklin.js',
Copy link
Contributor Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

The issue with creating two bundles for both scripts.js and lib-franking.js was that they have some common dependencies, and rollup tried to extract these to guarantee that both bundles can run standalone without any duplicate code being loaded. but currently scripts and franklin were loaded on every page, (webpack has an option for this: https://webpack.js.org/concepts/entry-points/#entrydescription-object but i didn't find something similar for rollup) and i wanted to have less number of requests as possible to test its effect. so i removed the script tag for franklin. the code is being imported by scripts.js anyways.

@stefanseifert stefanseifert changed the title Feature/js bundling Add JS bundling and minification with Rollup Feb 28, 2023
@stefanseifert stefanseifert self-requested a review February 28, 2023 16:18
add source map outputs for better debugging
@aem-code-sync
Copy link

aem-code-sync bot commented Mar 1, 2023

Page Score PSI Audit Google
/2021/ SI FCP LCP TBT CLS PSI

mbehzad added 2 commits March 2, 2023 09:01
add npm script to run the hlx dev server and rollup in watch mode for local devlopment
add pre-commit hook to build and add js artefacts to the commit
@aem-code-sync
Copy link

aem-code-sync bot commented Mar 2, 2023

Page Score PSI Audit Google
/2021/ SI FCP LCP TBT CLS PSI

@stefanseifert stefanseifert marked this pull request as draft March 2, 2023 09:19
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Development

Successfully merging this pull request may close these issues.

None yet

1 participant