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

Slow loading of control styles

     Hello, 

I am using tab controls in my application, but at the time of excecution, the control styles are loading very slow and the application is having a bad apparience during that time. It happens in chrome and edge. 

How can I enhance the speed while loading the styles of syncfusion controls? 

Thanks 

Jair

Attachment: pantallazo_562f517b.zip

12 Replies

KR Keerthana Rajendran Syncfusion Team June 6, 2017 06:00 AM UTC

Hi Jair, 
 
Thank you for contacting Syncfusion support. 
 
   
We suggest you to set the display css property of your control wrapper as none at initial stage and change this css property to block in create event of tab .   
  
 
<div class="container" style="width: 500px ; display:none"> 
        <ej-tab id="closeTab" show-close-button="true" create="oncreate"> 
            <e-tab-items> 
                <e-tab-item id="eJS" text="Rome"> 
                    <e-content-template> 
                        <div>  
                            Rome is one of the world's most fascinating cities. The old adage that Rome was not built in a day — and that you won't see it in one or even in three — is true. For the intrepid traveler who can keep pace, here is a list of must-sees. But remember what the Romans say: "Even a lifetime isn't enough to see Rome."   
                        </div> 
                    </e-content-template> 
                </e-tab-item> 
                <e-tab-item id="winRT" text="Paris"> 
                    <e-content-template> 
                        <div> 
                            Paris, the city of lights and love - this short guide is full of ideas for how to make the most of the romanticism that oozes from every one of its beautiful corners.You couldn't possibly visit Paris without seeing the Eiffel Tower. Even if you do not want to visit this world famous structure, you will see its top from all over Paris. The tower rises 300 meters tall (984 ft); when it was completed at the end of the nineteenth century. 
                        </div> 
                    </e-content-template> 
                </e-tab-item> 
                <e-tab-item id="orubase" text="London"> 
                    <e-content-template> 
                        <div> 
                            London is one of the most popular tourist destinations in the world for a reason. A cultural and historical hub, London has an excellent public transportation system that allows visitors to see all the fantastic sights without spending a ton of money on a rental car.London contains four World Heritage Sites: the Tower of London; Kew Gardens; the site comprising the Palace of Westminster, Westminster Abbey, and St Margaret's Church. 
                        </div> 
                    </e-content-template> 
                </e-tab-item> 
            </e-tab-items> 
         </ej-tab> 
    </div> 
<script> 
    function oncreate() { 
 
        $(".container").css("display", "block"); 
 
    } 
</script> 
 
We have prepared sample for your reference. Please refer to the below given link  
 
 
 
Regards, 
Keerthana 



JP Jair Piedrahita June 6, 2017 01:13 PM UTC

Thank you Kerthana, this will at least give the appearence the control is loading at once, however I would like to know a little more about this performance issues because is not the only control having this behaviour. Can you explain me a little more about this matter? 

Thanks and regards, 
Jair


KR Keerthana Rajendran Syncfusion Team June 7, 2017 12:37 PM UTC

Hi Jair, 
 
Since our controls are JavaScript based controls, there is a slight delay between control serialization and rendering using script. In this delay the serialized html element of the control in DOM are visible so we suggest to follow  the workaround in the previous update to make the control rendering even.The time taken for loading scripts and css increases the time taken for page load.In order to reduce this you can use CSG so that you can generate scripts only for the required controls and use that custom script in your application 
 
Regards, 
Keerthana.


SC Surbhi Chauhan February 8, 2021 11:14 AM UTC


I have created a website, to which I want to design something by putting it marquee. Please tell me about a particular type of marquee. Apart from this, I have to put four foreign watches in the footer of the website. Do you have any such script. Currently this post has been written in my website. Which is as follows - Flowers Name in Hindi and English Nimbu ke fayde Gulab Jal ke fayde Jackfruit in Hindi many more. please suggest some script for my website


KR Keerthana Rajendran Syncfusion Team February 9, 2021 09:47 AM UTC

Hi Surbhi, 
 
Based on your update, we are not clear on the exact Syncfusion control used in your application. Refer to the following demo and UG links for set of available controls in EJ1 
 
 
 
Please get back to us with clear details on your exact requirement with Syncfusion controls to proceed further.  
 
Regards, 
Keerthana.  



DI Divyanshu July 3, 2021 05:19 AM UTC

I have created a website, to which I want to design something by putting it marquee. Please tell me about a particular type of marquee. Apart from this, I have to put four foreign watches in the footer of the website. Do you have any such script. Currently this post has been written in my website. Which is as follows - 

Google Mera Naam Kya Hai Shadi Anudan Months Name in Hindi And English Guldaudi Flower in Hindi Frangipani Flower in Hindi



SS Sharon Sanchez Selvaraj Syncfusion Team July 5, 2021 07:38 AM UTC

Hi Divyanshu, 
 
We suspect you are not using any Syncfusion controls in your application. However as mentioned in the above update with the similar query, we had provided our control links earlier. So please refer to them and let us know if you have queries related to them. 
 
And in order to know more about the marquee tags and such, please refer to the common websites like W3Schools, Tutorialspoint etc. Over here, we have provided the link for your reference. 
 
 
 
 
 
Regards, 
 
Sharon Sanchez S. 



NK Noman Khan April 11, 2022 06:52 PM UTC



RP Ranjani Prabakaran Syncfusion Team April 12, 2022 05:39 AM UTC

Please contact us if you need any further assistance related to Syncfusion components. 


Regards,

Ranjani



NK Noman Khan April 24, 2022 04:03 PM UTC

Excellent Post Thanks For Sharing I am Daily Reader Of Your Blog And Check Out My Post Google Mera Naam Kya Hai



JU Juan replied to Keerthana Rajendran April 29, 2022 06:31 PM UTC

rendering is a problem if I have a complex form with several syncfusion components, do a test with two controls applying the solution provided by Syncfusion support and it works halfway. As you can see the stylo was only applied to a single control.Screenshot 2022-04-29 143001.png



IL Indhumathy Loganathan Syncfusion Team May 2, 2022 05:59 AM UTC

Hi Juan,


Before proceeding with your requirement, we would like to confirm whether the component you have rendered is from EJ1 or EJ2 to assist you promptly.


Here we have included our UG documentation for your reference.


EJ1: https://help.syncfusion.com/aspnet-core/richtexteditor/getting-started


EJ2: https://ej2.syncfusion.com/aspnetcore/documentation/rich-text-editor/getting-started


Please get back to us with the required details.


Regards,

Indhumathy L


Loader.
Up arrow icon