Ankündigung

Einklappen
Keine Ankündigung bisher.

JavaScript-Library nur einmal laden

Einklappen

Neue Werbung 2019

Einklappen
X
  • Filter
  • Zeit
  • Anzeigen
Alles löschen
neue Beiträge

  • JavaScript-Library nur einmal laden

    Hallo,

    ich habe in unserem CMS ein Tag implementiert, das ein Player-Window erzeugt. Das Tag kann vom Redakteuer mehrmals pro Seite eingebunden werden, was mehrere Player-Fenster zur Folge hat. Die Einbindung erfolgt über Java-Script-Code, der vom Tag erzeugt wird. Dieser hat folgende Gestalt:

    Code:
    <script language="JavaScript" type="text/javascript" src="http://***/mediautils/flashmediaplayer/swfobject.js"></script>
    <div id="strm_486d12f38383a">Du Depp hast kein Flash geladen!</div>
    <script language="JavaScript" type="text/javascript">
    <!--
    var so = new SWFObject('http://***/mediautils/flashmediaplayer/mediaplayer.swf','mpl','200','100','8');
    so.addParam('allowscriptaccess','always');
    so.addParam('allowfullscreen','true');
    so.addVariable('height','100');
    so.addVariable('width','200');
    so.addVariable('file','http://stream.***:554/***/stream/ncfom_javier_bardem.flv');
    so.addVariable('searchbar','false');
    so.addVariable('showstop','false');
    so.write('strm_486d12f38383a');
    -->
    </script>
    Wenn ich nun mehrere Tags pro Seite habe wird die Library

    Code:
    http://***/mediautils/flashmediaplayer/swfobject.js
    mehrmals vom Browser gezogen.

    Frage:
    Gibt es eine Möglichkeit, das JavaScript nur einmal zu laden? Falls ja, wie?
    Viele Grüße,
    Dr.E.

    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
    1. Think about software design before you start to write code!
    2. Discuss and review it together with experts!
    3. Choose good tools (-> Adventure PHP Framework (APF))!
    4. Write clean and reusable software only!
    ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~


  • #2
    Das Tag wird einfach durch obigen Code string-ersetzt? Hättest Du eine Möglichkeit, obiges JS zu ändern? Oder mußt Du mit dem Code leben? Wie ich das interpretiere wird ja die Library in der ersten Zeile geladen.
    --

    „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
    Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“


    --

    Kommentar


    • #3
      Du Depp hast kein Flash geladen!
      hehe, find ich gut

      kannst du nicht einfach bei der Tag-ersetzung schauen ob schon einer vorhanden ist und wenn ja halt die erste Zeile weglassen?

      Kommentar


      • #4
        Hallo ihr beiden,

        den HTML- bzw. JS-Code kann ich beeinflussen, der wird von meiner Tag-Implementierung generiert.

        @nikosch:
        Das Tag wird einfach durch obigen Code string-ersetzt?
        Exakt.

        Hättest Du eine Möglichkeit, obiges JS zu ändern?
        Ja.

        Oder mußt Du mit dem Code leben?
        Nein.

        Wie ich das interpretiere wird ja die Library in der ersten Zeile geladen.
        Korrekt.

        @cycap:
        kannst du nicht einfach bei der Tag-ersetzung schauen ob schon einer vorhanden ist und wenn ja halt die erste Zeile weglassen?
        Die Generierung des Tags findet auf der Serverseite statt, ich werde mal schaun, was ich da tun kann.
        Viele Grüße,
        Dr.E.

        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
        1. Think about software design before you start to write code!
        2. Discuss and review it together with experts!
        3. Choose good tools (-> Adventure PHP Framework (APF))!
        4. Write clean and reusable software only!
        ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

        Kommentar


        • #5
          Hey Doc,

          geh doch einfach den Weg des geringsten Widerstands und baue die Script-Library im Head-Element des HMTL-Dokumentes ein.

          "Dann wird die ja auf jeder Seite geladen"
          Richtig, allerdings nur einmal und danach vom Browser gecached.
          "Nobody is as smart as everybody" - Kevin Kelly
          — The best things in life aren't things

          Kommentar


          • #6
            Auf den Cache des Browsers verlassen? Also bei mir würde man bei nem eingestelltem Cache von 0 mb nicht weit kommen...

            Kommentar


            • #7
              Das kann ja sein, trotzdem wird die Library nur einmal pro Seite geladen - und das ist ja das Ziel!
              "Nobody is as smart as everybody" - Kevin Kelly
              — The best things in life aren't things

              Kommentar


              • #8
                geh doch einfach den Weg des geringsten Widerstands und baue die Script-Library im Head-Element des HMTL-Dokumentes ein.
                Das ist wahrscheinlich der einfachste Weg, weil JS meines Wissens kein Pendant zur include Anweisung besitzt. Vielleicht könntest Du Dein - ich sag jetzt mal - Template vorparsen und damit ermitteln, ob überhaupt ein Player-Tag vergeben wurde. Wenn ja bindest Du im Header die Library ein.
                Keine Ahnung ob das bspw. auch über JS und Erweiterung des DOM Baumes gehen würde.
                --

                „Emoticons machen einen Beitrag etwas freundlicher. Deine wirken zwar fachlich richtig sein, aber meist ziemlich uninteressant.
                Wenn man nur Text sieht, haben viele junge Entwickler keine interesse, diese stumpfen Texte zu lesen.“


                --

                Kommentar


                • #9
                  Zitat von cycap Beitrag anzeigen
                  Auf den Cache des Browsers verlassen? Also bei mir würde man bei nem eingestelltem Cache von 0 mb nicht weit kommen...
                  Auch da bin ich mal wieder neugierig: Warum? War Dir der Browser vorher zu schnell?
                  Und auf wie viele Benutzer trifft das zu? Optimiere ich für die 99.9% oder die handvoll verschrobenen Computerbastler? Sind die überhaupt meine Zielgruppe? Wie viel "Schaden" richtet die Optimierung bei dieser Gruppe an? Es funktioniert ja auch weiterhin bei Dir.

                  ---
                  Was passiert eigentlich mit dem (globalen) Objekt so? Wenn der Code nochmal in der Seite steht, wird so doch wieder überschrieben.

                  Kommentar


                  • #10
                    Jaa mir war der Browser vorher zu schnell ne scherz, aber manchmal könnte ich echt die kriese kriegen wenn sich irgendwas nicht ändert und ich erstmal ne Weile brauche bis ich merke das es im Cache hängt :P

                    Kommentar


                    • #11
                      Hallo zusammen,

                      danke für die Antworten. Auf den Browser werde ich mich aber genauso wenig verlassen, wie ich den Weg des geringsten Wiederstands gehen kann. Grund für letzteres ist, dass ich nicht weiß, auf welcher Seite das Tag eingebunden ist und nicht einfach pro forma auf jeder Seite das Script einbinden will, da das insgesamt eine Traffic-Steigerung bedeutet.

                      Ich werd das jetzt einfach per PHP und einem zusätzlichen Model lösen, bei dem ich zur Laufzeit meine Tags registriere und falls schon ein Tag registriert ist, den Script-Aufruf nicht ausgeben.
                      Viele Grüße,
                      Dr.E.

                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                      1. Think about software design before you start to write code!
                      2. Discuss and review it together with experts!
                      3. Choose good tools (-> Adventure PHP Framework (APF))!
                      4. Write clean and reusable software only!
                      ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

                      Kommentar


                      • #12
                        Dann muss Deine (serverseitige) Tag-Verarbeitung darüber Buch führen, ob das Skript bereits eingebunden wurde.

                        Kommentar


                        • #13
                          Kannst du keinen Zustand mitspeichern? Oder Elemente statt direkt in die Ausgabe an einen Head-Script Helper (wie z.B. bei Zend) schicken?

                          Ich hatte ein aehnliches Problem mit der Lightbox, es gab eine Menge View-Helper, die das Skript benoetigen, hab das dann ueber einen eigenen View-Helper (javaScriptFramework) geloest, dem ich useLightbox() aufrufen lassen hab. Da der View-Helper ein Objekt ist, kann ich ja speichern, ob die Funktion schon aufgerufen und die Lightbox schon eingebunden wurde.

                          javaScriptFramework()->useLightbox() ruft letztlich auch nur headScript->appendFile() auf.
                          "Mein Name ist Lohse, ich kaufe hier ein."

                          Kommentar


                          • #14
                            Hallo David, hallo Chriz,

                            ja, ich speichere den Zustand serverseitig. Das kann ich dadurch erledigen, dass ich ein Singleton-Objekt (Model) für den Tag definiere und dort meinen aktuellen Tag (Eindeutigkeit ist durch eine UID sichergestellt) registriere (=Buch führen). Das Hinzufügen eines weiteren Elements in den Head funktioniert auch, aber etwas umständlich, da ich mich durch das DOM hangeln muss. Ich hab jedoch mit unseren Entwicklern schon eine Möglichkeit diskutiert, die deiner - Chriz - schon recht nahe kommt. Ich kann mir innerhalb eines DOM-Knotens das Page-Objekt ziehen und dort einen weiteren Knoten (script-Tag) anhängen (appendNode()).

                            Damit ist das definitiv sauberer gelöst, wie mit JS-Gefrickel. Danke für die Antworten!
                            Viele Grüße,
                            Dr.E.

                            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                            1. Think about software design before you start to write code!
                            2. Discuss and review it together with experts!
                            3. Choose good tools (-> Adventure PHP Framework (APF))!
                            4. Write clean and reusable software only!
                            ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~

                            Kommentar


                            • #15
                              Hallo an alle!

                              Auch wenn das Problem nun gelöst ist steht immer noch die ursprüngliche Frage im Raum.

                              Frage:
                              Gibt es eine Möglichkeit, das JavaScript nur einmal zu laden? Falls ja, wie?

                              Antwort:
                              Ja die Möglichkeit besteht. Funktionieren kann das dann so:
                              Zuerst benötigen wir ein paar Funktionen
                              Code:
                                      /* function to search in arrays */
                                      function in_array(needle, haystack) {
                                          for (var i = 0; i < haystack.length; i++) {
                                              if (haystack[i] == needle) {
                                                  return true;
                                              }
                                          }
                                          return false;  
                                      }
                                      
                                      /* function to include a script */
                                      function include(script_filename) {
                                          var html_head = document.getElementsByTagName('head').item(0);
                                          var js = document.createElement('script');
                                          js.setAttribute('language', 'javascript');
                                          js.setAttribute('type', 'text/javascript');
                                          js.setAttribute('src', script_filename);
                                          html_head.appendChild(js);
                                          return true;
                                      }
                                      
                                      /* function checks if file is included already. if not: include() */
                                      /* needs an array */
                                      var included_files = new Array();
                                      /* function */
                                      function include_once(script_filename) {
                                          if (!in_array(script_filename, included_files)) {
                                              included_files[included_files.length] = script_filename;
                                              include(script_filename);
                                          }
                                          return true;
                                      }
                                      
                                      /**
                                      * function scans the document for already included files
                                      * and puts them into the 'included_files' array
                                      */
                                      function initIncludedFiles () {
                                          var scripts = document.getElementsByTagName('script');
                                          /* put them into the array if they have a 'src' attribute */
                                          for (var i=0; i < scripts.length; i++) {
                                              if(scripts[i].src) {
                                                  if (!in_array(scripts[i].src, included_files)) {
                                                      included_files[included_files.length] = scripts[i].src;
                                                  }
                                                  /**
                                                   * why the second if?
                                                   * if you have already double includes in your html-code,
                                                   * there is no need to list them double in the array ...
                                                   */
                                              }
                                          }
                                      }
                              Entweder man nutzt konsequent include_once() um Librarys etc. einzubinden
                              Code:
                              include_once('js/scripts/external.js');
                              oder man scannt das Dokument nach bereits existierenden <script>-Tags
                              Code:
                              initIncludedFiles();
                              include_once('js/scripts/external.js');
                              Ich denke die Funktionen sind recht nützlich!

                              PS: Ich konnte leider nicht früher antworten, sorry!
                              "Nobody is as smart as everybody" - Kevin Kelly
                              — The best things in life aren't things

                              Kommentar

                              Lädt...
                              X