STOP rad editor refreshing on timer tick event

12 posts, 1 answers
  1. James
    James avatar
    70 posts
    Member since:
    Jun 2009

    Posted 15 Jul 2009 Link to this post

    Hi.

    I have a timer in a master page which refreshes every 5 seconds. this timer updates a small update panel on the master page and is used to show the users who are accessing the record (using the querystring variables).

    THis works fine, always has worked fine and it is not a problem firing events an updating so frequently as the application is LAN based.

    the problem that i have is that the radeditor is updating on the timer tick event. By updating, i mean, it is doing "something" which stops you from scrolling, typing, whatever you may be doing in the rad editor at the time of the update.

    I DO NOT want to turn the timer off. i just don't want the rad editor to do anything on the timer's event. I only want the update panel that i have specifically set to update on the timer event to update.

    How can i stop the rad editor from reacting to the timer event?

    Thanks

    James
  2. Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 15 Jul 2009 Link to this post

    Hi James,

    Could you please test the following Auto Save example which uses a AJAX timer that refreshes the content of RadEditor? Do you experience the reported problem with it?

    Is it possible to send us a simple working project similar to the Auto Save demo that demonstrates the problem?

    Best regards,
    Rumen
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  3. UI for ASP.NET Ajax is Ready for VS 2017
  4. James
    James avatar
    70 posts
    Member since:
    Jun 2009

    Posted 15 Jul 2009 Link to this post

    Hi Rumen, thanks for the reply.

    the problem becomes worse and more noticable as the amount of text itn he editor grows. i tested it by changing the auto save example's timer interval to 5 seconds and pasting in the text below into the editor:

     this example isn't as bad as the problem we have. our timer event is used to update 2 update panels, ne of which is a formview. i can put an example together for you. it would be best if you can see it behaving slowly - will it be OK if i setup an example on the web for you to see or sdo you want to see the soucrce code as well?

    the email is in the rtf file linked to below - i know it's quite a lot of text, but that's the point - replying to the email and keeping it in a thread rather than sending out new emails each time.

     
    http://dev.mwlactive.net/harmoni_telerik/serviceDesk/email.rtf

  5. James
    James avatar
    70 posts
    Member since:
    Jun 2009

    Posted 15 Jul 2009 Link to this post

    Hi,
    if you follow this link:

    http://dev.mwlactive.net/harmoni_telerik/serviceDesk/emailstore.aspx?callid=1264

    you can see the page we're having the problem on. this is a copy of the live page, excepct the telerk rad editor is visible on page load (rather than hidden until the user clicks the new email button).

    when the rad editor is empty, you can see the page is responding normally. if you copy in the text from this RTF document (the same as the other post):

    http://dev.mwlactive.net/harmoni_telerik/serviceDesk/email.rtf

    you will see that when the timer click event occurs (or slightly after) the page stops responding in a timly fashion - eg if you keep srolling up and down, it will stop.


    if you then reload the exact same page with the time STOPPED via this link:
    http://dev.mwlactive.net/harmoni_telerik/serviceDesk/emailstore.aspx?callid=1264&notimer=true

    and then copy the text from the rtf file into the editor, you can see that there is no problem at all with the page.

    So it is the rad editor doing something when the timer event fires. the problem becomes more noticalbe with more text.

    so i just need to be able to stop the rad editor from doing anything on the timer click event which shouldn't be tied to the editor in any way!

    this behaviour happens in ie7, ie8 and chrome, so it is not browser specific.

    it also happens with shorter pieces of text such as this link:
    http://dev.mwlactive.net/harmoni_telerik/serviceDesk/shortletter.rtf

    and even a document with ony 44 words, but qute a lot of paragraphs, etc:
    http://dev.mwlactive.net/harmoni_telerik/serviceDesk/veryshort.rtf

    this document however works OK - it has the same content as the veryshort.rf, BUT DOES NOT HAVE AS MANY returns/Paragraphs.
    http://dev.mwlactive.net/harmoni_telerik/serviceDesk/veryshortLESSPARAS.rtf

    perhaps it si the number of returns/scrolling that is the problem? anyway - i hope this demonstrates the issues - if you can give me a work around to stop it causing the problem that will be great

    thanks

    james

  6. Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 20 Jul 2009 Link to this post

    Hi James,

    I was able to reproduce the slow down page responding only when saving the large content placed in email.rtf file and only in IE.
    Please, note that there are five main reasons responsible for the slow editor performance when editing large XHTML/HTML files (>100KB).

    Reason 1: The undo/redo mechanism and other maintenance code that ensures the smooth user experience - it gets increasingly cumbersome and time consuming for the browser to execute it if huge content is in the editor
    Reason 2: The fact that most of the editor functionality is implemented in JavaScript, thus resulting in 10 times slower performance compared to native compiled code.
    Reason 3: test the performance only when <compilation debug="false" in your web.config. When it is true, the MS AJAX debugging code kicks in and causes a severe performance hit on the client-side.
    Reason 4: Remove the RadEditor modules (you have already done this suggestion), e.g.

    <telerik:radeditor runat="server" ID="RadEditor1">
        <Modules>
            <telerik:EditorModule Visible="false" />
        </Modules>

    </telerik:radeditor>

    Reason 5 (valid when switching between the view modes or submitting the content): In difference with the TextBox control which does not process the content when submitting it to the server, the RadEditor runs content filters which validate the non well formatted content and make it XHTML compliant. Right now the editor runs more than 11 content filters. These filters run regular expressions which parse and validate the large content, which slow down the content submission to the server. You can disable the filters by setting ContentFilters property to None, e.g.

    <telerik:RadEditor ID="RadEditor1" ContentFilters="None" runat="server"></telerik:RadEditor> 

    The policy behind all radcontrols is that they should be cross-browser and should offer similar experience over different browsers and OS-es. At present the editor supports IE under Windows, Mozilla Firefox under all platforms, Opera under all platforms and Safari under Mac. Such cross-browser functionality is possible only with JavaScript - no other option exists.
    Being cross-browser is a top priority, and thus at present it rules out changing the editor's technology.

    We are constantly working on improving the speed, but the browsers do have their limits, and it is not hard to reach them when editing large content in the editor.

    You can find more information in the following KB article: RadEditor loads slowly (high CPU utilization).

    We strongly suggest avoiding loading or saving 100K of content into the editor in a real-world scenario (that is, other than for test purposes) - as an actual user will not get a good experience if they have to deal with editing 100K of HTML on a single go.


    Greetings,
    Rumen
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  7. James
    James avatar
    70 posts
    Member since:
    Jun 2009

    Posted 22 Jul 2009 Link to this post

    Hi Ruemn, sorry i think you've missed the point there.

    I appreciate all the points you make regarding speed and processing via javascript, etc, but that's not the issue (which is a good thing as the control behaves a lot better than you give it credit for!).
     
    there is a sole problem.

    I have a timer on the page. If i keep the timer turned off i can paste in the content of the rtf document 10 times over and get no performance degradation what so ever. i can change the font for all of this text, etc and it happens instantly.

    IF and ONLY IF i enable the timer again when the timer click event fires the radeditor does "something". this "something"  causes pauses in the rad editor and the IE interface. i just don't want the rad editor to do the "something" on the timer click event firing. i want to stop this undesired behavior.

    i have replicated this in google chrome.

    i will try and put together a simpler example including the source to show you if you like?
  8. Answer
    Rumen
    Admin
    Rumen avatar
    12851 posts

    Posted 27 Jul 2009 Link to this post

    Hi James,

    When the AJAX Timer control fires then the whole form of the page is submitted. Then all controls on the page submits their content including RadEditor, which executes its saveContent function. As large the content in RadEditor is as slow the page will be submitted and updated.

    You can check this information using the Profiler of FireBug in Firefox. A sample video demonstrating my test is attached. Noticed that the the saveContent function is one of the most time consuming functions.

    What you can do is to override the saveContent function when the content is being submitted by an AJAX timer, for example put a flag in the timer event and after that check this flag in the overridden saveContent function

    var originalSaveContent = Telerik.Web.UI.RadEditor.prototype.saveContent;
        Telerik.Web.UI.RadEditor.prototype.saveContent= function()
        {
        };

    Call the original function only when you want to save the content.


    All the best,
    Rumen
    the Telerik team

    Instantly find answers to your questions on the new Telerik Support Portal.
    Check out the tips for optimizing your support resource searches.
  9. James
    James avatar
    70 posts
    Member since:
    Jun 2009

    Posted 17 Aug 2009 Link to this post

    Hi Rumen.

    Sorry for the delay in responding, it's taken me this long to get 5 minutes to implement this!

    I can confirm that adding the blank functionto override teh save content has fixed this problem and my page now works a treat!

    thanks very much for you help on this!

    James
  10. Sindhuja
    Sindhuja avatar
    3 posts
    Member since:
    Apr 2013

    Posted 22 May 2013 Link to this post

    Hi Rumen,

        I too have this same issue, when ever there is a button Click event on the page the if the Rad editor content is more then the page hangs for a while and then starts the process. 
        I tried overriding the javascript function by calling the same on the Button OnClientClick event but no use, still having  the same issue.

        

    <script type="text/javascript">

    function AvoidTelerikRefresh() { 

    var originalSaveContent = Telerik.Web.UI.RadEditor.prototype.saveContent;

    Telerik.Web.UI.RadEditor.prototype.saveContent = function () { };

     }

    </script>

    <asp:Button runat="server" ID="btnUpload" Text="Upload" CssClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"

    OnClick="btnUpload_Click" OnClientClick="AvoidTelerikRefresh();" />

  11. Slav
    Admin
    Slav avatar
    1356 posts

    Posted 27 May 2013 Link to this post

    Hi Sindhuja,

    The issue most probably occurs because the function saveContent is not overridden before the upload button initiates postbacks. You can use the following approach to ensure that the button will postback after the saveContent function is modified:
    <script type="text/javascript">
     
        function AvoidTelerikRefresh() {
            var originalSaveContent = Telerik.Web.UI.RadEditor.prototype.saveContent;
            Telerik.Web.UI.RadEditor.prototype.saveContent = function () {  };
            __doPostBack("<%=btnUpload.UniqueID %>", "");
        }
     
    </script>
    <asp:Button runat="server" ID="btnUpload" Text="Upload" CssClass="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only"
        OnClientClick="AvoidTelerikRefresh(); return false;" UseSubmitBehavior="false" />

    Keep in mind that the function needs to be restored after the button click so that the content of the RadEditor is saved correctly when needed.

    Regards,
    Slav
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
  12. Sindhuja
    Sindhuja avatar
    3 posts
    Member since:
    Apr 2013

    Posted 27 May 2013 Link to this post

    Hi Slav,

        Thank you for the reply.
        I tried applying the __doPostBack("<%=btnUpload.UniqueID %>", ""); and the return false;" UseSubmitBehavior="false"  but the Telerik control performance issue still happens L. Is there any else that I missed? On the upload button click the page actually hangs for a while and then starts the process. The Content loaded in the telerik Control is around 200 KB.

     

     

  13. Slav
    Admin
    Slav avatar
    1356 posts

    Posted 30 May 2013 Link to this post

    Hi Sindhuja,

    I have attached a sample page that shows the previously suggested approach with slight modifications. If you click on the button Do not save RadEditor content, the content of the editor will not be submitted as required. The other buttons is added to demonstrate a standard page submit.

    Regards,
    Slav
    Telerik
    If you want to get updates on new releases, tips and tricks and sneak peeks at our product labs directly from the developers working on the RadControls for ASP.NET AJAX, subscribe to their blog feed now.
Back to Top
UI for ASP.NET Ajax is Ready for VS 2017