|
|
Publicerad på 2018-07-30 10:30:45
|
|
|
Införandet
Flyweight-läget stöder effektivt ett stort antal finordnade objekt genom att köra delningsteknologi, vilket undviker överhuvudet med ett stort antal små klasser med samma innehåll (såsom att förbruka minne), och tillåter alla att dela en klass (meta-klass).
Inom programmering är det ibland nödvändigt att producera ett stort antal finkorniga klassinstanser för att representera data, och om du kan upptäcka att dessa instanser har i princip samma overhead förutom några få parametrar, kan antalet klasser som behöver instansieras minskas avsevärt. Om du kan flytta dessa parametrar utanför klassinstansen och skicka in dem när metoden anropas, kan du kraftigt minska antalet enskilda instanser genom att dela.
Så vad händer om du använder meta-läget i JavaScript? Det finns två sätt, det första tillämpas på datalagret, främst på ett stort antal liknande objekt i minnet; Den andra tillämpas på DOM-lagret, som kan användas i den centrala händelsehanteraren för att undvika att händelsehandtagen kopplas till varje barnelement i föräldracontainern.
Njut av metaversum och datalager
Det finns två viktiga begrepp i Flyweight – internt tillstånd intrinsiskt och externt tillstånd extrinsiskt, internt tillstånd hanteras i objektet via interna metoder, och extern information kan raderas eller sparas externt.
För att uttrycka det rakt på sak innebär det att först nypa en originalmodell, och sedan med olika tillfällen och miljöer, och sedan producera specifika modeller med egna egenskaper, uppenbarligen måste nya objekt genereras här, så fabriksläget dyker ofta upp i Flyweight-läget, det interna tillståndet för Flyweight används för att dela, och Flyweight-fabriken ansvarar för att underhålla en Flyweight-pool (mönsterpool) för att lagra objekten i det interna tillståndet.
Använd Yuanyuan-läget
Låt oss visa att om vi hade ett bibliotek som hanterade alla böcker, skulle metadata för varje bok preliminärt se ut så här:
ID
Titel
Författare
Genre
Sidantal
Utgivare-ID
ISBN
Vi behöver också definiera när och av vem varje bok lånades, samt återlämnandes datum och tillgänglighet:
Utcheckningsdatum
checkoutMedlem
förfalloReturnDatum
Tillgänglighet
Eftersom book-objektet är inställt på följande kod, observera att koden ännu inte har optimerats:
Programmet kan vara okej i början, men med tiden kan antalet böcker öka i stora mängder, och varje bok har en egen version och kvantitet, och du kommer märka att systemet blir långsammare och långsammare. Tusentals bokobjekt i minnet kan föreställas, och vi behöver optimera dem med delningsläget.
Vi kan dela in data i två typer av data: intern och extern, och data relaterade till bokobjektet (titel, författare, etc.) kan tillskrivas interna attribut, medan (checkoutMember, dueReturnDate, etc.) kan tillskrivas externa attribut. På detta sätt kan följande kod dela samma objekt i samma bok, eftersom oavsett vem som lånar boken, så länge boken är samma bok är grundinformationen densamma:
Definiera den grundläggande fabriken
Låt oss definiera en grundläggande fabrik för att kontrollera om objektet i boken skapades tidigare, returnera om det finns, och återskapa och lagra det om inte, vilket säkerställer att vi bara skapar ett objekt för varje typ av bok:
Hantera extern status
Det yttre tillståndet är relativt enkelt, förutom boken vi kapslade in, allt annat måste hanteras här:
På detta sätt kan vi spara samma information från samma bok i ett bookmanager-objekt, och endast en kopia; Jämfört med den tidigare koden sparas mycket minne.
Njut av metaläget och DOM
Jag ska inte säga så mycket om DOM-bubblingsincidenten här, jag tror att alla redan vet, låt oss ge två exempel.
Exempel 1: Centraliserad incidenthantering
Till exempel, om vi har många liknande typer av element eller strukturer (som menyer, eller flera li i ul) som behöver övervaka hans klickhändelse, då måste vi binda varje ytterligare element för händelsebindning, om det finns väldigt, väldigt många element kan prestandan föreställas, och kombinerat med kunskapen om bubbling, om något barnelement har en händelseutlösare, kommer händelsen att bubbla till det högre elementet efter att ha triggats, så med denna funktion kan vi använda Xiangyuan-läget. Vi kan övervaka händelserna för föräldraelementen till dessa liknande element, och sedan avgöra vilket barnelement som har en händelse utlöst innan vi fortsätter med vidare operationer.
Här kommer vi att kombinera jQuerys bind/unbind-metoder som exempel.
HTML:
JavaScript:
Exempel 2: Använd Xiangyuan-läget för att förbättra prestandan
Ett annat exempel, fortfarande relaterat till jQuery, generellt använder vi elementobjektet i callback-funktionen för händelsen, vi använder ofta formen $(this), faktiskt skapar det upprepade gånger ett nytt objekt, eftersom detta i callback-funktionen redan är DOM-elementet självt, vi måste använda följande kod:
Faktum är att om vi måste använda något som $(this), kan vi också implementera vår egen version av single-instance-mönstret, till exempel kan vi implementera en funktion som jQuery.signle(this) för att returnera själva DOM-elementet:
Hur man använder:
Detta returnerar själva DOM-elementet som det är, utan att skapa ett jQuery-objekt.
sammanfattning
Flugviktsläge är ett läge som förbättrar programmets effektivitet och prestanda, vilket avsevärt ökar programmets körhastighet. Det finns många tillämpningar: till exempel, om du vill läsa en serie strängar från en databas, många av dem dubbletter, kan vi lagra dessa strängar i en Flyweight-pool.
Om en applikation använder ett stort antal objekt, och dessa stora antal objekt orsakar mycket lagringsglädje, bör den överväga att använda delningsläget; Om du tar bort objektets externa tillstånd kan du ersätta många grupper av objekt med relativt få delade objekt, och du kan överväga att använda Xiangyuan-läget.
Referensadress:http://www.addyosmani.com/resour ... ok/#detailflyweight
|
Föregående:Rekommenderar 3 webbplatser för att hitta ikonikonerNästa:AntalPåVäntandeMeddelanden, MeddelandeKö, Meddelande...
|
