04.07.2019 Views

frontend-developer-1

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Customize and Create JavaScript<br />

How does Magento minify JavaScript?<br />

Magento’s minification of JS is a two part system. The first part is to configure<br />

RequireJS to add a .min suffix to files. The second part is to minify the files.<br />

Magento tells requireJS to download minified files through the minified resolver:<br />

vendor/magento/module-require-js/Model/FileManager.php,<br />

ensureMinResolverFile() method.<br />

Then, Magento will minify the files as necessary. vendor/magento/framework/<br />

App/StaticResource.php is responsible for minifying each file.<br />

This is where the hand-off to the JShrink library happens: vendor/magento/<br />

framework/Code/Minifier/Adapter/Js/JShrink.php<br />

The minified files are saved with a .min suffix. As a result, all the file names are<br />

different in production. This poses a potential problem during deployment if<br />

those assets are built outside of the primary Magento database, or if the setting is<br />

changed at some point after the assets are built. If the static content is deployed<br />

with a different setting, none of the Javascript on the site will work.<br />

What is the purpose of JavaScript bundling and minification?<br />

To reduce download time and make the <strong>frontend</strong> more useful and faster.<br />

6.5 UI COMPONENT CONFIGURATION<br />

UI components are a complex and large framework. Unfortunately, their steep<br />

learning curve has given them a bad reputation in the community. While this section<br />

Copyright © 2018, SwiftOtter, Inc.<br />

85

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!