Du bist nicht angemeldet.

Stilllegung des Forums
Das Forum wurde am 05.06.2023 nach über 20 Jahren stillgelegt (weitere Informationen und ein kleiner Rückblick).
Registrierungen, Anmeldungen und Postings sind nicht mehr möglich. Öffentliche Inhalte sind weiterhin zugänglich.
Das Team von spieleprogrammierer.de bedankt sich bei der Community für die vielen schönen Jahre.
Wenn du eine deutschsprachige Spieleentwickler-Community suchst, schau doch mal im Discord und auf ZFX vorbei!

Javascript und RAM Verbrauch

Werbeanzeige

BlueCobold

Community-Fossil

Beiträge: 10 738

Beruf: Teamleiter Mobile Applikationen & Senior Software Engineer

  • Private Nachricht senden

11

24.01.2018, 11:19

Zitat von »Javaprogrammer«

Ich habe gestern auch gesehen das irgendwie dieses Chrome Developer Tool Fenster vom Chrome Browser den RAM Verbrauch anheben koennte
Du sollst nicht im Task-Manager schauen was passiert, wenn du die Developer-Tools öffnest, sondern Chrome hat einen eigenen Task-Manager unter "weitere Tools". Und dieser listet dir den Speicherverbrauch jedes Tabs separat auf. Da musst du nicht raten wie viel an was geht.
Teamleiter von Rickety Racquet (ehemals das "Foren-Projekt") und von Marble Theory

Willkommen auf SPPRO, auch dir wird man zu Unity oder zur Unreal-Engine raten, ganz bestimmt.[/Sarkasmus]

Javaprogrammer

Frischling

  • »Javaprogrammer« ist der Autor dieses Themas

Beiträge: 25

  • Private Nachricht senden

12

24.01.2018, 11:52

Zitat von »Schorsch«

Zitat von »Javaprogrammer«

Ja das waren schon hilfreiche Tips. Ich habe gestern auch gesehen das irgendwie dieses Chrome Developer Tool Fenster vom Chrome Browser den RAM Verbrauch anheben koennte und ich werde das alles mal mehr beobachten, vielleicht habe ich etwas Glueck und stelle nachher fest das es doch nicht an meinem Javascript liegt sondern an diesem Developer Tool Fenster das geoeffnet war.

Das spielt doch hier keine Rolle. Du sollst dir den Speicherverbrauch in Chrome selbst ansehen. Dafür öffnest du die Developertools und schaust unter Memory. Da kannst du dann prüfen was dein Javascript-Code an Speicher verbraucht. Unabhängig von anderen Programmen oder Chrome selbst.


Ich habe gesehen das man beim Chrome Developer Tool unter Memory irgendwie Sachen einstellen muss und sich damit deswegen schon etwas auskennen muss. Die Ergebnisse die dabei rauskommen zeigen mir Unerfahrenen auch nicht direkt wo das Problem in meinem Javascript genau liegen kann.

Gibt es den keine anderen besseren Tools die irgendwie direkt mein Javascript Code checken koennen und Fehler finden koennen welche den RAM Verbrauch hoch treiben?

Schorsch

Supermoderator

Beiträge: 5 145

Wohnort: Wickede

Beruf: Softwareentwickler

  • Private Nachricht senden

13

24.01.2018, 11:59

Ich habe deinen Code jetzt mal kurz überflogen. An sich wird der RAM Verbraucht vermutlich nicht besonders hoch sein. Ein Problem ist aber dass du JavaScript falsch zu verstehen scheinst. JavaScript arbeitet an vielen Stellen nicht synchron sondern asynchron. Ein Beispiel ist dein AJAX Aufruf. Wenn das nicht so wäre dann würde dein Browser oder zumindest deine Seite so lange einfrieren bis ein Ergebnis zurück kommt. In deinem Fall würde das alle zwei Sekunden passieren. Das wäre ziemlich schlecht. Normalerweise arbeitet mal mit Callback Methoden. Sobald der AJAX Call ein Ergebnis bekommt wird dann die von dir angegebene Methode aufgerufen.

edit: Hab das grad noch mal gecheckt. Du nutzt synchrone Calls für AJAX. Mach das nicht.
„Es ist doch so. Zwei und zwei macht irgendwas, und vier und vier macht irgendwas. Leider nicht dasselbe, dann wär's leicht.
Das ist aber auch schon höhere Mathematik.“

Michael

Supermoderator

Beiträge: 3 731

  • Private Nachricht senden

14

24.01.2018, 13:07

Zitat von »Schorsch«

Hab das grad noch mal gecheckt. Du nutzt synchrone Calls für AJAX. Mach das nicht.

Jou! ;)

Verwende besser die aktuelle Version von jQuery.
Bezüglich AJAX wurde da einiges verbessert und optimiert.
(1.5 ist sieben Jahre alt)

setInterval statt setTimout, um einmalig den Timer zu setzen/initialisieren

Referenzen auf Elemente speichern, statt sie immer wieder neu abzufragen (getElementById)

Anzahl der globalen Variablen möglichst kleinhalten

... usw. usf.
fka tm

Javaprogrammer

Frischling

  • »Javaprogrammer« ist der Autor dieses Themas

Beiträge: 25

  • Private Nachricht senden

15

24.01.2018, 14:42

Zitat von »Schorsch«

Ich habe deinen Code jetzt mal kurz überflogen. An sich wird der RAM Verbraucht vermutlich nicht besonders hoch sein. Ein Problem ist aber dass du JavaScript falsch zu verstehen scheinst. JavaScript arbeitet an vielen Stellen nicht synchron sondern asynchron. Ein Beispiel ist dein AJAX Aufruf. Wenn das nicht so wäre dann würde dein Browser oder zumindest deine Seite so lange einfrieren bis ein Ergebnis zurück kommt. In deinem Fall würde das alle zwei Sekunden passieren. Das wäre ziemlich schlecht. Normalerweise arbeitet mal mit Callback Methoden. Sobald der AJAX Call ein Ergebnis bekommt wird dann die von dir angegebene Methode aufgerufen.

edit: Hab das grad noch mal gecheckt. Du nutzt synchrone Calls für AJAX. Mach das nicht.


Wenn ich in der ajax Function den Parameter "async: false" auf "async: true" einstelle:

Quellcode

 
1

Downloadliste_Textinhalt = $.ajax({ url: "Downloadliste.txt", contentType:"application/json", dataType:"json", async: true }).responseText;


wird dann daraus schon ein asynchroner Aufruf, oder muss ich noch mehr am Codeaufbau veraendern, damit es asynchron wird?

Ich habe oft Javascript Codes gesehen wo statt normaler Parameter irgendwie Funktionen uebergeben werden und das bis heute nie richtig erforscht was dahinter ist, ich nehme an das koennte etwas mit diesem Thema synchron und asynchron zu tun haben. Ich weis jetzt auch nur das asynchron bedeutet das gewartet wird bis der Code bereit ist und dann wird erst ausgefuehrt, aber wie man das korrekt aufbaut muss ich erst noch lernen.

Ja es ist im Prinzip mein erstes richtiges Javascript Projekt deswegen versuche ich das jetzt alles zu optimieren, damit ich auch in Zukunft den besten Weg beim Bauen mit Javascript weis.

David Scherfgen

Administrator

Beiträge: 10 382

Wohnort: Hildesheim

Beruf: Wissenschaftlicher Mitarbeiter

  • Private Nachricht senden

16

24.01.2018, 14:48

Nein, das geht so nicht.
Du kannst nicht einfach .responseText machen. Zu dem Zeitpunkt ist die Anfrage ja noch gar nicht fertig.
Das Ganze läuft asynchron im Hintergrund, darum musst du auch die Funktionen (Callbacks) angeben. Diese werden aufgerufen, sobald die Anfrage fertig ist.
David Scherfgens Website | Konzentrationstest Polizei

Javaprogrammer

Frischling

  • »Javaprogrammer« ist der Autor dieses Themas

Beiträge: 25

  • Private Nachricht senden

17

24.01.2018, 15:00

Zitat von »Michael«

Zitat von »Schorsch«

Hab das grad noch mal gecheckt. Du nutzt synchrone Calls für AJAX. Mach das nicht.

Jou! ;)

Verwende besser die aktuelle Version von jQuery.
Bezüglich AJAX wurde da einiges verbessert und optimiert.
(1.5 ist sieben Jahre alt)

setInterval statt setTimout, um einmalig den Timer zu setzen/initialisieren

Referenzen auf Elemente speichern, statt sie immer wieder neu abzufragen (getElementById)

Anzahl der globalen Variablen möglichst kleinhalten

... usw. usf.

Zitat von »Michael«

setInterval statt setTimout


Ich habe jetzt die neuste jquery version eingestellt.

Bist du dir sicher das in meinem Fall "setInterval" besser ist als "setTimout"? Weil ich kann mich dran erinnern das ich in den letzten Tagen etwas gelesen hatte wo gemeint wird das man "setInterval" am besten bei sowas wie Simulationen benutzen sollte und "setTimeout" waere die Variante wo dem Ablauf mehr Zeit gegeben wird, bei "setInterval" wird alles direkt durchgefuehrt, also so habe ich den Artikel zumindest verstanden, der war auf Englisch.

Ueber das Thema globale Variablen habe ich auch etwas gelesen, da wurde auch bemerjt das globale Variablen irgendwie mehr Speicher verbrauchen, aber wenn ich jetzt zum Beispiel innerhalb der Funktionen die Variablen erstelle, wuerde das nicht noch mehr Speicher verbrauchen, weil dann jedesmal die Variable neu erstellt wird?

Beispiel 1, Variablen innerhalb der Funktion deklarieren:

Quellcode

 
1
2
3
4
5
6
7
8

function ServerFunktion()
{
    var strurl="Save_data_1.php?name="+Downloadliste_Object.Name[ZaehlerIndex];
    var res=$.ajax({ url: strurl, contentType:"application/json", dataType:"json", async: false }).responseText;

     //---- 2000 = 2 sekunden
     setTimeout(ServerFunktion, 2000);
}


Beispiel 2, Variablen ausserhalb der Funktion deklarieren:

Quellcode

 
1
2
3
4
5
6
7
8
9
10

var strurl="";
var res="";
function ServerFunktion()
{
    strurl="Save_data_1.php?name="+Downloadliste_Object.Name[ZaehlerIndex];
    res=$.ajax({ url: strurl, contentType:"application/json", dataType:"json", async: false }).responseText;

     //---- 2000 = 2 sekunden
     setTimeout(ServerFunktion, 2000);
}


Welche von beiden erzeugt weniger RAM Verbrauch?



Und wie ist es mit dem Objekt, welche Variante verbraucht weniger RAM.

Beispiel 1, Objekt innerhalb der Funktion deklarieren;

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13

function ServerFunktion()
{
    var Downloadliste_Object = new Object();
    Downloadliste_Textinhalt = $.ajax({ url: "Downloadliste.txt", contentType:"application/json", dataType:"json", async: false }).responseText;
    
     if(isJson(Downloadliste_Textinhalt)==true)
       {
           Downloadliste_Object = JSON.parse(Downloadliste_Textinhalt);
       }//json Check

     //---- 2000 = 2 sekunden
     setTimeout(ServerFunktion, 2000);
}


Beispiel 2, Objekt ausserhalb der Funktion erstellen:

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13

var Downloadliste_Object = new Object();
function ServerFunktion()
{
    Downloadliste_Textinhalt = $.ajax({ url: "Downloadliste.txt", contentType:"application/json", dataType:"json", async: false }).responseText;
    
     if(isJson(Downloadliste_Textinhalt)==true)
       {
           Downloadliste_Object = JSON.parse(Downloadliste_Textinhalt);
       }//json Check

     //---- 2000 = 2 sekunden
     setTimeout(ServerFunktion, 2000);
}


Wenn ich das Objekt innerhalb der Funktion erstelle, wuerde das dann nicht immer wieder neu erstellt und der RAM Verbrauch schneller nach oben gehen?

Kannst du mir auch ein Beispiel geben wie das aussieht wenn man Referenzen auf Elemente speichert?

Ich habe hier ein Beispiel gebaut wo aber eine Fehlermeldung bei raus kommt.

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

var Downloadliste_Object = new Object();
var Referenz1=document.getElementById("test2");
function ServerFunktion()
{
    Downloadliste_Textinhalt = $.ajax({ url: "Downloadliste.txt", contentType:"application/json", dataType:"json", async: false }).responseText;
    
     if(isJson(Downloadliste_Textinhalt)==true)
       {
           Downloadliste_Object = JSON.parse(Downloadliste_Textinhalt);
           strurl="Save_data_1.php?name="+Downloadliste_Object.Name[ZaehlerIndex];
           res=$.ajax({ url: strurl, contentType:"application/json", dataType:"json", async: false }).responseText;
           Referenz1.innerHTML = res;
       }//json Check

     //---- 2000 = 2 sekunden
     setTimeout(ServerFunktion, 2000);
}

David Scherfgen

Administrator

Beiträge: 10 382

Wohnort: Hildesheim

Beruf: Wissenschaftlicher Mitarbeiter

  • Private Nachricht senden

18

24.01.2018, 15:03

Hast du meinen Beitrag oben gelesen?
setInterval: Etwas immer wieder ausführen, z. B. jede Sekunde.
setTimeout: Etwas einmalig ausführen nach Ablauf einer gewissen Zeit, z. B. nach einer Sekunde.
David Scherfgens Website | Konzentrationstest Polizei

Javaprogrammer

Frischling

  • »Javaprogrammer« ist der Autor dieses Themas

Beiträge: 25

  • Private Nachricht senden

19

24.01.2018, 15:05

Zitat von »David Scherfgen«

Nein, das geht so nicht.
Du kannst nicht einfach .responseText machen. Zu dem Zeitpunkt ist die Anfrage ja noch gar nicht fertig.
Das Ganze läuft asynchron im Hintergrund, darum musst du auch die Funktionen (Callbacks) angeben. Diese werden aufgerufen, sobald die Anfrage fertig ist.


Wenn ich das anders aufbaue, ohne der Jquery Ajax Funktion so wie im folgendem Beispiel, ist das nicht auch eine bessere Variante und zugleich asynchron?

Quellcode

 
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15

var xhttp2 = new XMLHttpRequest();
function ReadFile()
{
      var url = "ReadData.php";
      
      xhttp2.onreadystatechange = function() 
      {
          if (this.readyState == 4 && this.status == 200) 
             {
               console.log("Rueckgabe von PHP Datei "+this.responseText);
             }
      };
      xhttp2.open("GET", url, true);
      xhttp2.send();
}

David Scherfgen

Administrator

Beiträge: 10 382

Wohnort: Hildesheim

Beruf: Wissenschaftlicher Mitarbeiter

  • Private Nachricht senden

20

24.01.2018, 15:07

Geht auch (du solltest das XMLHttpRequest-Objekt aber innerhalb der Funktion erzeugen und nicht global), halt ohne jQuery. Wenn du eh schon jQuery nutzt, kannst du es auch für Ajax benutzen. jQuery ist bequemer, macht einige Magic im Hintergrund und versucht dich ein wenig vor inkonsistentem Verhalten der verschiedenen Browser zu schützen.
David Scherfgens Website | Konzentrationstest Polizei

Werbeanzeige

Ähnliche Themen