Vermeiden Sie das erneute Rendern von Bildern und anderen Objekten aus Backbone-Ansichten

Wenn ich eine Backbone-Ansicht neu gerendert habe, was ist eine gute Möglichkeit, das Rendern von Bildern und Google Maps zu überspringen? Meine Foto- und Kartenansichten flackern jedes Mal, wenn die Ansicht neu gerendert wird (was ziemlich oft passiert). Insbesondere bei den Bildern legt die Template-Engine das Layout von Grund auf neu an, wodurch die Image-Tags die Bitmap entweder vom Server oder aus dem Cache holen.Vermeiden Sie das erneute Rendern von Bildern und anderen Objekten aus Backbone-Ansichten

Natürlich möchte ich immer noch, dass die Ansicht vom Layout irgendwie agnostisch bleibt, also sollte es technisch nicht wissen, dass wir ein Bild anzeigen werden, richtig?

Quelle

2012-06-13 preslavrachev

hängt davon ab, wie Sie die Bilder rendern? Verwenden Sie Lenker oder fügen Sie sie einfach als Text ein? – jakee

Ich verwende an dieser Stelle Schnurrbart und füge einfach die URLs aus dem Datenmodell ein. Ich dachte daran, irgendwann an den Lenker zu springen. Wird das helfen? – preslavrachev

Komponieren Sie Ihre Vorlage immer neu? – jakee

Ich werde eine Lösung anbieten, die mit Ihrer Annahme in Konflikt steht "die Ansicht sollte von der Vorlage agnostisch sein".

Wenn Sie render() jederzeit etwas rufen im Modell geändert hat Sie haben diese blinkt in Ihrem Browser, vor allem, wenn die Vorlage groß ist.

Meine Empfehlung ist, trennt die render der Ansicht, die nur einmal passiert, wenn der View erstmals sichtbar gemacht und mehr update Methoden Helfer, die die Aktualisierung kleine Stücke der Ansicht verantwortlich sind verknüpft mit konkreten Modellattributen.

Zum Beispiel:

// code simplified and not tested 
var MyView = Backbone.View.extend({ 
    initialize: function(){ 
    this.model.on("change:title", this.updateTitle, this); 
    this.model.on("change:description", this.updateDescription, this); 
    // ... more change:XXX 
    }, 

    render: function(){ 
    this.$el.html(this.template(this.model.toJSON())); 
    }, 

    updateTitle: function(){ 
    this.$el.find(".title").html(this.model.get("title")); 
    }, 

    updateDescription: function(){ 
    this.$el.find(".description").html(this.model.get("description")); 
    }, 

    // ... more updateXXX() 
})

Quelle

2012-06-13 09:40:33 fguillen

das stimmt, und ich habe diesen Ansatz für eine ganze Weile verfolgt ... aber mehr und mehr begann ich zu sehen, die großen Namen in der JS-Community für eine klare Trennung von Bedenken beraten ... obwohl technisch Vorlagen in JS ist immer noch irgendwie fehlerhaft – preslavrachev

@ user1107412 es gibt immer eine konstante Spannung zwischen _Patterns_ und _pragmatism_ :) (Pragmatismus: _ein Ansatz, der Theorien oder Überzeugungen in Bezug auf den Erfolg ihrer praktischen Anwendung auswertet_ Oxford English Dictionary). – fguillen

@ user1107412: Sie können die Ansicht in eine Gruppe von Teilansichten zerlegen und dann die kleinen Teilansichten nach Bedarf aktualisieren. Das wäre wahrscheinlich sinnlos pedantisch, wenn eine Ansicht nicht schon zu kompliziert wäre. –

Um das beste Ergebnis zu erhalten, möchten Sie den HTML-Code, der Ihre Medien enthält, nicht neu rendern. Daher würde ich empfehlen, mehr Zielansichten für den Inhalt zu verwenden, sodass Sie die Ansichten nicht neu rendern müssen mit Inhalt, der das nicht tut.

Quelle

2012-06-13 09:38:19 lecstor

Vermeiden Sie das erneute Rendern von Bildern und anderen Objekten aus Backbone-Ansichten

Antwort

Verwandte Themen