2in1: Komprimieren von Javascript

Hi an alle!! Hätte da eine Frage an das Forum...Ich würde gerne bestimmte Teile von JS zB.: das .replace(oder zB. das innerHTML) vereinfachen und hierfür zB.(möglicherweise gibt es einen anderen Weg) in einer Variablen ausdrücken zB.:

statt:
<script>
document.write("HAllo".replace(/A/gi,"a"))
</script>

mit der Verwendung von zB. .bind() (oder mögl. mit call??...oder ist es möglich den Maschinencode umzuschreiben??..so wie in einer Kompilierung??):
<script>
var a=replace.bind(replace)
document.write("HAllo".a(/A/gi,"a"))
</script>

...nur anders wie in meinem Bsp. sollte es funktionieren ;)...wichtig ist dass die Lösung natürlich kürzer ist...sonst macht das ganze ja keinen Sinn! Glg und danke an euch alle für eure Mühe!

  1. Hi an alle!!

    Hi.

    Vielleicht hab ich nicht ganz verstanden, was du meinst, aber wieviele zehn( oder hundert)tausend Zeilen Code hast du denn, dass sich durch das Einsparen von ein paar Buchstaben ein Performance-Vorteil ergeben könnte?

    Unabhängig von der theoretischen Möglichkeit, erscheint mir das nicht sonderlich sinnvoll. ;)

    Hast du denn Performance-Probleme, und falls ja, schon alle anderen möglichen Ursachen behoben?

    Gruß,

    Roadster.

  2. PS:

    Wenn du bloß schreibfaul bist und dir dadurch keine Performance-Probleme _entstehen_ kannst du natürlich auch entsprechende Funktionen definieren und abrufen:

    var element = document.getElementBy( element.id );  
      
    a ( element, 'Hallo' );  
      
    function a ( elm, txt ) {  
      
      elm.innerHTML = txt;  
      
    }
    

    ;)

    Gruß,

    Roadster.

    1. PPS:

      var element = document.getElementBy( element.id );

      Ja ja. [code lang=javascript]document.getElementById

        
      ;)  
        
      Gruß,  
        
      Roadster.
      
    2. Nimm das getElementById noch mit in die Funktion, dann spart es wirklich Platz und vor allem Tipparbeit wenn a an vielen Stellen aufgerufen wird.

        
      a ("id1", 'Hallo' );  
        
      function a (id, txt ) {  
        
       document.getElementById(id).innerHTML = txt;  
        
      }
      
      1. Nimm das getElementById noch mit in die Funktion, dann spart es wirklich Platz und vor allem Tipparbeit wenn a an vielen Stellen aufgerufen wird.

        a ("id1", 'Hallo' );

        function a (id, txt ) {

        document.getElementById(id).innerHTML = txt;

        }

          
        lol, der Vorschlag ist ansich schon völlig abseitig, aber ja, konsequenterweise sollte man das dann auch noch machen ;)  
          
        Mal ehrlich, ab wievielen tausend Zeichen Code bringt eine Komprimierung einen spürbaren Vorteil?  
          
        Mein derzeitiger Rekord liegt bei ca. 350k Zeichen inklusive großzügigem whitespace zum Wohle der Leserlichkeit und eine Komprimierung hat testweise NULL spürbaren Effekt gehabt. - Zumindest auf meinem Desktop nicht...
        
      2. function a(i){return document.getElementById(i);}  
        function a0(t,n){return document.getElementsByTagName(t)[n];}  
        function a1(c,n){return document.getElementsByClassName(c)[n];}  
        function a2(a,n){return document.getElementsByName(a)[n];}  
        function a3(i){return a(i).tagName;}  
        function a4(i){return a(i).nodeName;}  
        function a5(i){return a(i).nodeType;}  
        function a6(i){return a(i).nodeValue;}  
        function a7(i){return a(i).className;}  
        function b(i){return a(i).childElementCount;}  
        function b0(i){return a(i).hasChildNodes();}  
        function b1(i){return a(i).childNodes;}  
        function b2(i){return a(i).children;}  
        function b3(i){return a(i).firstChild;}  
        function b4(i){return a(i).firstElementChild;}  
        function b5(i){return a(i).lastChild;}  
        function b6(i){return a(i).lastElementChild;}  
        function b7(i){return a(i).nextSibling;}  
        function b8(i){return a(i).nextElementSibling;}  
        function b9(i){return a(i).previousSibling;}  
        function b10(i){return a(i).previousElementSibling;}  
        function b11(i){return a(i).parentNode;}  
        function b12(i){return a(i).parentElement;}  
        function c(i,t){a(i).innerHTML=t;}
        

        ...to be continued ;)

        1. function a(i){return document.getElementById(i);}

          function a0(t,n){return document.getElementsByTagName(t)[n];}
          function a1(c,n){return document.getElementsByClassName(c)[n];}
          function a2(a,n){return document.getElementsByName(a)[n];}
          function a3(i){return a(i).tagName;}
          function a4(i){return a(i).nodeName;}
          function a5(i){return a(i).nodeType;}
          function a6(i){return a(i).nodeValue;}
          function a7(i){return a(i).className;}
          function b(i){return a(i).childElementCount;}
          function b0(i){return a(i).hasChildNodes();}
          function b1(i){return a(i).childNodes;}
          function b2(i){return a(i).children;}
          function b3(i){return a(i).firstChild;}
          function b4(i){return a(i).firstElementChild;}
          function b5(i){return a(i).lastChild;}
          function b6(i){return a(i).lastElementChild;}
          function b7(i){return a(i).nextSibling;}
          function b8(i){return a(i).nextElementSibling;}
          function b9(i){return a(i).previousSibling;}
          function b10(i){return a(i).previousElementSibling;}
          function b11(i){return a(i).parentNode;}
          function b12(i){return a(i).parentElement;}
          function c(i,t){a(i).innerHTML=t;}

          
          >   
          > ...to be continued ;)  
          >   
          >   
            
            
          Danke nochmals an euch alle!! 
          
  3. @@2in1:

    nuqneH

    Wenn ich dich richtig verstehe, willst du dein JavaScript minifizieren.

    Qapla'

    --
    „Talente finden Lösungen, Genies entdecken Probleme.“ (Hans Krailsheimer)
  4. Lieber 2in1,

    Du kannst in JS fast alles verbiegen, aber ob das die Wartbarkeit Deines Codes so wirklich verbessert, sei einmal dahingestellt.

    var a=replace.bind(replace)
    document.write("HAllo".a(/A/gi,"a"))

    Du kannst mit dem Prototyping jedem String-Objekt eine neue Methode geben:

    String.prototype.a = String.prototype.replace;

    Obiger Code erzeugt für alle String-Objekte (vorhandene wie zukünftig erzeugte) eine neue Methode "a", welche ein Alias für die Methode "replace" ist. Du kannst nun tatsächlich var good = "HAllo".a(/A/, "a"); notieren.

    Das will man aber eigentlich nicht. Wenn Du Dein JS komprimieren willst, dann gibt es dafür fertige Werkzeuge. Diese machen Deinen Code kleiner, damit die Ladezeiten kürzer werden. Nach der Komprimierung kannst Du am Code aber nichts mehr sinnvoll verändern. Daher ist es besser, Du bist bei Deinem Quelltext ausführlich und lässt ihn anschließend für die tatsächliche Seite komprimieren.

    Liebe Grüße,

    Felix Riesterer.

    --
    "Wäre die EU ein Staat, der die Aufnahme in die EU beantragen würde, müsste der Antrag zurückgewiesen werden - aus Mangel an demokratischer Substanz." (Martin Schulz, Präsident des EU-Parlamentes)
    1. Lieber 2in1,

      Du kannst in JS fast alles verbiegen, aber ob das die Wartbarkeit Deines Codes so wirklich verbessert, sei einmal dahingestellt.

      var a=replace.bind(replace)
      document.write("HAllo".a(/A/gi,"a"))

      Du kannst mit dem Prototyping jedem String-Objekt eine neue Methode geben:

      String.prototype.a = String.prototype.replace;

      Obiger Code erzeugt für alle String-Objekte (vorhandene wie zukünftig erzeugte) eine neue Methode "a", welche ein Alias für die Methode "replace" ist. Du kannst nun tatsächlich var good = "HAllo".a(/A/, "a"); notieren.

      Das will man aber eigentlich nicht. Wenn Du Dein JS komprimieren willst, dann gibt es dafür fertige Werkzeuge. Diese machen Deinen Code kleiner, damit die Ladezeiten kürzer werden. Nach der Komprimierung kannst Du am Code aber nichts mehr sinnvoll verändern. Daher ist es besser, Du bist bei Deinem Quelltext ausführlich und lässt ihn anschließend für die tatsächliche Seite komprimieren.

      Liebe Grüße,

      Felix Riesterer.

      Danke!!! Das beantwortet meine Frage zu 100%...Hab mir schon alle "Werkzeuge" angesehen...die können halt leider nicht wirklich viel...habs ewig mit dem bind und call versucht...DANKE!!!...und DANKE auch an alle anderen!!!

  5. Hallo 2in1,

    ich weiß jetzt nicht so genau, was dein Ziel ist, aber wenn es nur darum geht Traffic zu sparen, solltest du html-, css- und js-Dateien einfach g(nu)zipped ausliefern. So mache ich es.

    Gruß, Jürgen

    1. Hallo 2in1,

      ich weiß jetzt nicht so genau, was dein Ziel ist, aber wenn es nur darum geht Traffic zu sparen, solltest du html-, css- und js-Dateien einfach g(nu)zipped ausliefern. So mache ich es.

      Gruß, Jürgen

      Habs mit Google komprimieren versucht...da ist gzipp auch dabei...aber des kann leider nicht viel...der Code wird nur minimal verkürzt!..zusätzlich hat das ganze noch Fehler drin...zB.: statt if(){} nimmt man &&() und das liefert falsh als Ausgabe wenn die f(x) eben falsh ist und nicht wie bei if(){} nichts!!... Glg