Uploaded image for project: 'Tapestry 5'
  1. Tapestry 5
  2. TAP5-1781

Improve javascript load time of pages improving onDomLoadedCallback

    Details

      Description

      One of tapestry main slow loading of big pages with many forms and components is the need of initializing the observers for popup up messages and for the click on submit elements.
      Right now tapestry is using two $$, one for each process, and then creating an observe for each element. This way, although working fine, is terrible slow in ie7 with big pages.
      One way to improve this issue is using less observes and removing the $$. This patch observe the document element for click and keyup events, and then checks if the element is one of the one we want fire some event.

      Index: src/main/resources/org/apache/tapestry5/tapestry.js
      ===================================================================
      — src/main/resources/org/apache/tapestry5/tapestry.js
      +++ src/main/resources/org/apache/tapestry5/tapestry.js
      @@ -99,6 +99,12 @@ var Tapestry = {

      /** Initially, false, set to true once the page is fully loaded. */
      pageLoaded : false,
      +
      + /** Initially, false, set to true once we start observing the document for clicks. */
      + trackingClicks : false,
      +
      + /** Initially, false, set to true once we start observing events for displaying errors. */
      + trackFocusError : false,

      /**

      • Invoked from onclick event handlers built into links and forms. Raises a
        @@ -196,25 +202,11 @@ var Tapestry = {
      • Adds a focus observer that fades all error popups except for the
      • field in question.
        */
      • $$("INPUT", "SELECT", "TEXTAREA").each(function(element) {
      • /*
      • * Due to Ajax, we may execute the callback multiple times, and we
      • * don't want to add multiple listeners to the same element.
      • */
      • var t = $T(element);
        -
      • if (!t.observingFocusChange) {
      • element.observe("focus", function() {
      • if (element != Tapestry.currentFocusField) { - document.fire(Tapestry.FOCUS_CHANGE_EVENT, element); - - Tapestry.currentFocusField = element; - }
      • });
        -
      • t.observingFocusChange = true;
      • }
      • });
        + if (!Tapestry.trackFocusError) { + document.observe("keyup", Tapestry.errorPoup.bind(this)); + document.observe("click", Tapestry.errorPoup.bind(this)); + Tapestry.trackFocusError = true; + }

      /*

      • When a submit element is clicked, record the name of the element into
        @@ -224,17 +216,26 @@ var Tapestry = {
      • TAP5-1418: Added "type=image" so that they set the submitting element
      • correctly.
        */
      • $$("INPUT[type=submit]", "INPUT[type=image]").each(function(element) {
      • var t = $T(element);
        -
      • if (!t.trackingClicks) {
      • element.observe("click", function() { - $(element.form).setSubmittingElement(element); - }

        );
        -

      • t.trackingClicks = true;
      • }
      • });
        + if (!Tapestry.trackingClicks)
        Unknown macro: {+ Event.observe(document, "click", function(event) { + var element = event.findElement(); + if (element.tagName == "INPUT" && (element.type=="submit" || element.type=="image")) + $(element.form).setSubmittingElement(element); + });+ + Tapestry.trackingClicks = true;+ }

        + },
        +
        + errorPoup : function(event) {
        + var element = event.findElement();
        + if (element.tagName == "INPUT" || element.tagName == "SELECT" || element.tagName == "TEXTAREA" )

        Unknown macro: {+ if (element != Tapestry.currentFocusField) { + document.fire(Tapestry.FOCUS_CHANGE_EVENT, element); + + Tapestry.currentFocusField = element; + }+ }

        },

      /*

        Attachments

          Activity

            People

            • Assignee:
              hlship Howard M. Lewis Ship
              Reporter:
              pjayala Pedro Ayala
            • Votes:
              0 Vote for this issue
              Watchers:
              1 Start watching this issue

              Dates

              • Created:
                Updated:
                Resolved: