We use cookies to give you the best experience on our website. If you continue to browse, then you agree to our privacy policy and cookie policy. Image for the cookie policy date

ejs script reference using async or defer mode

Hi,

I have referred ejs scripts in my page in async or defer mode like given below, because this is JS file is very bog like 4 MB size. So that i am loading this file as asynchronous mode.

<script src="~/lib/ej2/ej2-CRMWeb.min.js" defer="defer" async></script>

But while loading the page it is showing the console error like ejs undefined

Please kindly help me to resolve this.

Thanks and Regards,
Mani

7 Replies

KS Kumaresan Subramani Syncfusion Team April 22, 2019 10:37 AM UTC

Hi Mani, 
 
Currently we are validating your query. We will update the further details in one business day. 
 
Please let us know if you have any concern. 
 
Regards, 
Kumaresan S 



MA Mani May 4, 2019 01:41 PM UTC

Hi kumresan,

Any update on this?


VR Vairamuthu Ramamoorthi Syncfusion Team May 6, 2019 01:14 PM UTC

Hi Mani , 

Async parameter in script tag loads the script asynchronously. The execution of script manager starts before script is completely loaded, so it throws script error(ejs undefined). For reducing script loading time, we can generate component specific scripts (which is smaller in size) using Customer Resource Generator (CRG). Refer the below links for further details. 

CRG application link : https://crg.syncfusion.com/ 

Regards, 
Vairamuthu R 



KM Khalid Mahmood November 12, 2024 11:14 AM UTC

Hi, Vairamuthu Ramamoorthi

Even after using CRG Syncfusion.js file size is 3.5MB and that must loaded in <head> that blocks page loading and on slow internet it can take too much time that give negative impact on Application.
Even I have tried defer loading with  <ejs-scripts defer></ejs-scripts> but Script Manager executes immediately before loading the script that is quite annoying. Is there any ways execute script manager on  DOMContentLoaded Event? 



AK Arun Kumar Ragu Syncfusion Team November 14, 2024 04:06 AM UTC

Hi Khalid Mahmood,

Since <ejs-scripts> renders content from the server, it expects the ejs library to be fully loaded on the client side before executing. This dependency means that using async or defer on the ejs script tag can cause timing issues, where ScriptManager executes before ejs is available, resulting in the ejs is undefined error.

Why async and defer Don’t Work Here

  • Async loads the script independently and executes it as soon as it’s downloaded, which may happen after the ScriptManager starts running.
  • Defer ensures the script loads after HTML parsing, but it may still not load in time for ScriptManager if there are network delays or a large file size.

Solution for Faster Loading

  • Use the Syncfusion CDN: Loading ejs from Syncfusion’s CDN can improve performance by leveraging a distributed network of servers, ensuring faster delivery of the script without needing async or defer.

           <script src="https://cdn.syncfusion.com/ej2/27.1.55/dist/ej2.min.js"></script>

  • Generate Component-Specific Scripts via CRG: To further reduce load times, use the Custom Resource Generator (CRG) to create smaller, component-specific scripts. This approach decreases the initial script size, improving page load times without causing timing conflicts with ScriptManager.
  • CRG resources:
          CRG application link : https://crg.syncfusion.com/ 


Regards,

Arun Kumar R



KM Khalid Mahmood replied to Arun Kumar Ragu November 23, 2024 11:41 AM UTC

@Arun Kumar Ragu
Is there any option to load Independent Component  from CDN like I only want to RTE on page. because complete file is 23MB from CDN and CRG file again included manually.



AK Arun Kumar Ragu Syncfusion Team November 25, 2024 01:42 PM UTC

Hi Khalid Mahmood,


We suspect that you might have referred both the CDN and the CRG-generated file. Kindly ensure that you are using only one of these. The CDN includes scripts for all Syncfusion components, whereas if you need only the RTE component, you can use the CRG (Custom Resource Generator) to download the script specifically for RTE.


For more details, please refer to the documentation linked below.

https://ej2.syncfusion.com/aspnetcore/documentation/common/custom-resource-generator

https://ej2.syncfusion.com/aspnetcore/documentation/common/adding-script-references


Regards,

Arun Kumar R


Loader.
Up arrow icon