I'm trying to figure out how to load only the files required to render the Elements of a page.
Different Razor pages may use different controls, so ideally I'd like to run a central configuration (such as cldr data and locale) in the shared _Layout file, and include the required components on a page level.
Looking at the browsers network tab, I can see that the total file size of ej2.min.js is 7.22 MB, but it shows "transferred" as 1.52 MB - which is is way more acceptable than 7.22 MB when I only need a schedule and a few select boxes... The CDN server appears to leverage HTTP/2. Does the CDN already do what I need?
I've seen the CRG https://ej2.syncfusion.com/aspnetcore/documentation/common/custom-resource-generator/ but that would still require to create bundles of individual files when I'd like to use individual components on a per page basis. If you could confirm my assumptions above then it appears that the CDN is the better way to approach this.
Kindly check the sample and let us know if you need further assistance.
STStefanJanuary 16, 2019 12:01 PM
thanks for your reply. Unfortunately this does not answer my question. I did mention that I'm aware of the CRG and wondered
a) whether the CDN server, by using the HTTP/2 protocol, already manages my requirement; or
b) since the individual files already appear to include AMD (asynchronous module definitions) statements, how to leverage this in an ASP Net core environment. I'm not certain on how to go about using require.js or similar with the structure of the files, and can't find documentation explaining the structure of the components. The only reference I could find it to the CRG, which is inconvenient in times where we have npm and gulp.
Thank you for pointing me into the right direction.
KKKarthigeyan Krishnamurthi Syncfusion Team January 17, 2019 07:38 AM
Thanks for your update.
Please find the below responses.
We have the ej2.min.js compressed file in zip format for size optimization in the CDN link. This will be automatically extracted by the browser and get the complete content of ej2.min.js file, which is the reason for the lesser size of 1.52 MB while the whole file size if 7.22 MB.
CRG file is better than NPM and Gulp. By using CRG, we can generate the particular control script file with particular modules. For example, if no resize and Drag & drop feature is used in your sample, you can generate the Schedule script file without those module code examples unlike NPM and Gulp. If you wish to use require.js in Core application, kindly revert, we will check and provide further details.
STStefanJanuary 17, 2019 08:19 AM
thank you for your reply.
I find the CRG rather inconvenient - presently I can update a line in my packages.json and get a new version, which is then copied to the wwwroot/lib through a gruntfile.
Say that most of my pages only use an autocomplete, a dropdown and a toast, then I'd like to render a partial view that includes exactly those scripts and css.
Another page may then load a bigger component, such as the Schedule, where again I may have included a dropdown and an autocomplete as well.
On that page, I may want to render a different partial to only load those components.
Using the CRG, I'd have to re-do this for any combinations of files that may be required, and also lose the option of caching individual file that may have been in use before. So a user who visited page one will already have requested the js file for autocompletes and dropdowns before, those would be in his cache.
I am very interested in your suggestion number 2; to either use webpack or require.js or similar methods to leverage the Async module loading that appears to be available.