quindi l’annuncio è di parlare con
una finale funzionale
quello che si chiama questo discorso sarà
un po ‘collegato a questo, ma penso di essere io
voglio dare questo tipo di variazione
di questo discorso un contesto più ampio e
in realtà questo discorso potrebbe essere chiamato te
Conoscere l’immutabilità interagire con l’interattività
e clojurescript ma onestamente potrebbe
si chiama interattività immutabilità e
inserire la lingua della scelta esso
non importa davvero la cosa che sono
assicurato qui sta comunicando il
principi non una lingua specifica così
Fino a poco tempo fa ero impiegato al New
York Times per circa quattro anni fa
sviluppo front-end lì e quello era
un sacco di divertimento nel mio background
interfacce utente di tutti i tipi di utente
interfacce in cui ho fatto interfacce utente
cacao e Java e C ++ e ho speso
più tempo facendoli in JavaScript I
ora lavoro a cognate echt e sono eccitato
a tale proposito
affini X un posto divertente perché loro sono
probabilmente di tutte le cose che prendono il
mutabilità come una sorta di centrale
affittuario di tutte le cose che progettano
entrambi sapete che c’è una specie di steward
hanno chiuso la lingua che
abbraccia l’immutabilità e a
soluzione di database piuttosto interessante
chiamato atomico che sottolinea anche
immutabilità, ma voglio parlare di più
in particolare sull’immutabilità nel
contesto delle interfacce utente così
programmazione orientata agli oggetti di un utente
interfacce sorta di venuto per essere quasi
nello stesso tempo intendo che gli oggetti lo hanno fatto
di apparire alla fine degli anni ’60 ma noi davvero
non è stato fino a chiacchiere fino al
variante con cui siamo più familiari
è venuto per essere e allo stesso tempo
l’interfaccia utente moderna è venuto a
si questa è l’immagine di alcuni bambini che giocano
con un piccolo sistema di talk come sai
Xerox PARC se puoi accendere un
immagine parlata di piccole dimensioni oggi c’è molto
fantastica versione open-source di small
parlare chiamato squittio puoi installarlo
puoi scrivere chiacchiere su di esso se tu
aprire il browser di sistema che consente
tu per vedere tutte le classi che sono
coinvolto nell’intero sistema che vorresti
probabilmente incontrano le parole Model View
controller giusto
quindi è abbastanza selvaggio, quindi
lo sai che non lo so
l’immagine era probabilmente la fonte dei bambini
la metà degli anni ’70, quindi sono 30 anni di MVC
e le persone hanno il codice ha optato per questo termine
quando parlano di web-based
anche i sistemi, ma fondamentalmente l’ idea
è stato il primo familiare di trig Vereen skog
e Adelle Goldberg a Xerox PARC in
1979 e ha avuto un tempo estremamente lungo
ombra i concetti di base sono ancora
prevalente oggi se lo fai
sviluppo front-end
Non importa se tu lo sei
è il targeting per iOS Android JavaScript MVC
un modo molto popolare per organizzare l’ uso
interfacce e questo perché penso a
un livello molto astratto MC MVC è un
estremamente suona la separazione delle preoccupazioni
ma le implementazioni lasciano molto da essere
desiderato
non siamo davvero avanzati molto lontano
inoltre là di quello che si avvicinò con
quel PARC di Xerox che è piuttosto triste
dato che ha 30 anni e il
cosa che farò domande qui sono io
credo che possiamo ottenere tutti i benefici
dei sistemi MVC tradizionali ma possiamo
eliminare questa cosa che non mi piace
sull’implementazione che è quella
le ambasciate sono costruite sopra
punti metallici e probabilmente lo sei
pensando come hai potuto farlo come può
ottieni tutti i vantaggi di NBC e
eliminare qualcosa che quasi tutti
ambasciate moderni hanno che è quella
sono costruiti in cima allo stato
oggetti così da gettare la nostra chiave inglese in questo
storia della programmazione dell’interfaccia utente però quale
gioca in questo discorso perché lo siamo
sarà una specie di enfatizzazione del web
i browser sono inventati da Tim berners-lee
questa cosa si chiama il browser web nel
fine anni ’80 su una macchina successiva, quindi a
il tempo aveva uno dei più potenti
Strutture MVC il prossimo passo alla fine
divenne cacao che ora è anche tutti
sa a causa di iOS ma lui lui
ha preso questo ricco sistema desktop MVC e lui
costruito il primo browser web al mondo
browser e l’idea dietro i browser web
non volevo creare un utente ricco
interfacce Voglio un documento di collegamento ipertestuale
su una rete era l’ unica cosa
era destinato a farlo
testuale hyperlinked
documenti che sono resi proprio lì
era no, non aveva senso risolvere il
ricco problema di interfaccia utente che è qui
non quello non era quello non era un obiettivo esso
era un obiettivo completamente non così non lo faccio
pensa di aver visto per la prima volta un futuro in cui la maggior parte
le persone interagiscono o no, ma molte altre
le persone interagiscono con il web attraverso il
documento modello oggetto se ne hai fatto
se hai fatto un lavoro serio su
web questo è più o meno il motivo per cui la tua vita
è terribile
perché il modello dell’oggetto documento è
fondamentalmente sui documenti non lo era
sulle interfacce utente non si tratta
eventi, voglio dire, queste cose non lo sono
significato per loro sono stati progettati i Dom
progettato per risolvere un problema diverso
e così quando guardo il tipo di
panorama di ciò che le persone stanno facendo
browser Web e DOM e JavaScript
lo sai che sembra davvero così
destra
Alan Kay ha questa grande analogia
ray dice troppo spesso l’ architettura del software
assomiglia un po ‘alle Grandi Piramidi
è molto impressionante da guardare
ma non c’è un percorso concettuale profondo
l’idea qui è che sai che è così
andando a prendere migliaia di persone
centinaia di anni per costruire proprio così
spesso il software si sente così e il
e fa questa affermazione interessante che
spesso ciò che manca dal software
lo sviluppo è una piccola e semplice idea e
allora puoi avere un radicalmente diverso
architettura puoi avere molto di più
posizionamento efficiente di architettura
materiale e sottolinea che lo era
l’arco proprio questo estremamente semplice
concetto ha permesso agli umani di costruire un
tipo di edificio completamente diverso
e quindi penso che tu sappia che lo faremo
I DUI stiamo cercando questo arco I
non penso che l’abbiamo ancora trovato MVC è un
buon punto di partenza ma penso che ci sia
qualcosa manca così orientato agli oggetti
i programmatori hanno avuto la possibilità che arrivassero
con MVC
è fantastico ma abbiamo bisogno di qualcosa
più e così forse dovremmo guardare a cosa
i programmatori funzionali lo stanno facendo
c’è una cosa chiamata funzionale
programmazione reattiva FR
è ancora un’area molto attiva di
ricerca se ti piace Haskell
avremmo sentito parlare di questo è abbastanza
accademico e hanno molti problemi
hanno ancora bisogno di risolvere per farlo
lavoro c’è uno stato orientato agli oggetti
Affronta questo che sta diventando davvero
popolare ora chiamato Rx da Microsoft rx
Java rx cacao tutto questo roba il giusto
è l’ approccio orientato agli oggetti su FRP
è molto interessante sicuramente fantastico
per coordinare eventi e complessi
flussi di lavoro asincroni comunque
in realtà non risolve il problema che
tu incontri gli occhi che dicevano come facciamo noi
affrontare il fatto che la fine al
bordi del nostro tipo di sistema che dobbiamo
rendere qualcosa che l’utente deve vedere
qualcosa se vieni da go the
vai al linguaggio di programmazione o se sei se
sei nella medicazione di chiusura
questa cosa si chiama core async allora hai
probabilmente sentito parlare di CSP questo è Toni
l’ astrazione della puttana, ma di nuovo lo è anche
un linguaggio di coordinamento che non ha
davvero affrontare il problema di rendering così
potresti star pensando bene, forse MVC lo è
forse non c’è altro, forse
forse siamo solo bloccati con lo stato
oggetti e dobbiamo rizzare
queste piramidi di interfacce utente che
sono difficili da modificare difficili da estendere
per mantenere forse non c’è arco e io
e discuterò dall’avere
giocato a lungo con la chiusura
tempo e questo è probabilmente vecchio cappello per
per le persone che hanno giocato in giro con
Haskell o Scala ma c’è stato un
incredibile quantità di incredibile pratica
la ricerca accademica è entrata in qualcosa
chiamato strutture dati persistenti che
Non ho intenzione di presumere che voi ragazzi
ho sentito parlare e voglio parlare
loro ora perché penso che ci danno un
opportunità di semplificare il coordinamento
di interfacce utente e stato giusto quali
penso che sia la fonte principale di
complessità e un utente complicato
l’interfaccia è che ne hai un sacco
componenti stateful come fai
coordinarli come sai chi è
cambiando lo stato e penso
struttura dati persistente possono ordinare di
rendilo trattabile quindi lo mostrerò
alcune diapositive non sono mie diapositive
su come persistenti strutture dati
lavoro solo per
hai una specie di senso su come sono capace
per venire a compiere da circa a mostrare
queste diapositive sono state fatte da Zack
in una scuola di packer che è davvero
fantastico tipo di coder come un codice
gli scrittori si ritirano a New York e così via
rubare le sue diapositive in modo funzionale
mi ha dato nei dati
programmatori funzionali come i dati loro
come valori immutabili non mutabili
oggetti ogni volta che cambi qualcosa
cambia tutto ciò che intendi sei
andando a modificare qualcosa per ottenere un nuovo
valore che non cambierai il
cose originali quindi non è come si ottiene
un array e tu muti la cosa al
secondo indice il vecchio valore che loro
rappresentare è ormai andato per sempre non lo facciamo
così è così che si trova la parola
proviene persistente e la cosa interessante
che sto per dimostrare è quello
iniziando nei primi anni 2000 a causa di a
carta di Phil Bagwell ora capiamo
come puoi farlo in modo efficiente così sono
assumendo che tutti abbiano visto una lista collegata
e potresti dire che è così noioso
è come se conoscessi le strutture dati 101
ma le liste collegate sono davvero interessanti
proprietà se li tratti in un mutabile
modo che dimostra come
le strutture di dati persistenti funzionano quelle
usiamo in chiusura e quelli che sono
usato in Scala e Haskell quindi un link
elenca che hai qualcosa in testa
e punta ad altri elementi in questo
lista collegata
bene la cosa carina di una lista collegata
è se le icone se io se ho una nuova testa
e indico X ciò che è bello di questo
è che ho due valori distinti, giusto ma
questi due valori distinti effettivamente condividono
tre elementi che sono in realtà
condividere la memoria qui così anche se Y
rappresenta la lista con la Y
sulla testa rappresenta un particolare
valore non ha distrutto il valore che X
rappresenta ora puoi immaginare che io
potrebbe ottenere la coda di X e quindi contro Z
sulla testa di questo e ora ho
tre valori distinti ma tutti condividono
più del 50% di memoria, proprio questo è un
proprietà davvero interessante delle liste collegate
condivisione strutturale così struttura di condivisione
ci dà l’ efficienza dello spazio
ma ci dà anche computazione
efficienza quando aggiorniamo qualcosa
significa che possiamo aggiornare qualcosa
senza dover aggiornare senza nuovi
copy-on-write quindi questo è un tradizionale
la tecnica è che se ho dei dati
Struttura e voglio aggiornarlo ed io
voglio sembrare avere una mutabilità noi
semplicemente copia l’intera cosa, naturalmente
quando arrivi ad un milione di milioni
elementi giusti che non sono efficienti quindi
le strutture dati persistenti ci consentono di
aggiornare una grande struttura di dati in a
modo funzionale e stiamo andando a
minimizzare la copia e potrebbe non esserlo
ovvio come farlo e ho intenzione di farlo
mostrarti così riempire Bagwell che purtroppo
morto il cappello si avvicinò con questa cosa
ha chiamato la mappa dell’array hash prova che ha scritto
questo documento in come 2002 all’EPFL dove
Scala è stato creato ed è venuto fuori
con una variante mutabile ricca di lettura Hickey
la carta era come questa è fantastica
solo modificandolo un pochino possiamo
creare una variante immutabile di questi dati
struttura quindi ho intenzione di mostrare un più semplice
versione una variante più semplice non l’hash
mappa array prova perché è un po ‘
complicato ma ho intenzione di mostrarti
come possiamo avere un array immutabile come
tipo quindi ha tutte le proprietà che noi
è piaciuto su matrici è accesso casuale
come un ArrayList puoi, se puoi
aggiungi alla fine in modo efficiente possibile
puoi puoi dividerli in modo efficiente
e così via così l’idea qui è quella
i dati vivono nelle foglie e nel modo
quello che un albero vettoriale bitmap
in realtà è solo un albero di array giusto
è solo un albero di array ed è
sta per essere un albero prefissato che usiamo
per trovare un elemento particolare ma è
sarà un albero di prefissi bit a bit e
vediamo che aspetto ha, quindi facciamolo
scegli alcune dimensioni arbitrarie per i nostri nodi
array con quattro elementi a loro così
ogni elemento di quell’array punta
a un altro array della stessa dimensione
ogni matrice di quel punto a un altro
quattro array di quella dimensione e poi
finalmente abbiamo colpito i nodi foglia dove il nostro
i valori vivono e qui abbiamo solo il
numeri che rappresentano gli indici
giusto così come troviamo qualcosa
questo e abbiamo detto che era un albero prefissato
quindi cerca di indicizzarlo, quindi immagina di volerlo
per trovare il centesimo sesto elemento in
questo in questa rappresentazione bene
il numero ha una rappresentazione binaria e
possiamo mascherare i bit per arrivare a dove
dobbiamo essere mascherati dai primi due
bit questo è l’indice 1 quindi scendiamo
quaggiù mascheriamo i prossimi due bit
questo è l’indice 2 è di nuovo 2 ed è
finalmente due proprio così per poter ottenere
là cosa dovevo fare devo fare
tre ricerche di array e alcune maschere di bit
questa è roba che la JVM e
i moderni motori JavaScript che compila
verso il basso conoscete le istruzioni x86
questo sarà molto veloce e allora
sull’aggiornamento quindi se voglio aggiornare
cosa devo aggiornare devo solo
aggiorna il percorso e tutti i nodi sul
percorso per la cosa che ho bisogno di cambiare e
qui ho intenzione di sostituire 106 con
la stringa pippo
tutti quegli altri nodi, giusto che non lo siano
sta per cambiare e quindi probabilmente lo farai
pensando bene, sai cosa sono quattro
al quarto cosa è questo in modo che se noi
se abbiamo il vettore e la dimensione del nodo
quattro possiamo contenere 256 elementi così è
sembra ok così come si scopre se tu
fare un sacco di test empirici 32 è un
grandi dimensioni è una dimensione in cui cercare
e gli aggiornamenti sono una specie di un rapporto ottimale
questa è l’immagine di una borsa con la carta
quello ha preso la variante di Rich e loro
ulteriormente esteso solo per darti un
il senso di quanto sia bello immaginare realmente
un vettore persistente che ha 32 livelli
di nota sono dispiaciuti sette livelli di nodi
dove ogni elemento è 32 largo che è 32
al settimo potere
sono 34 miliardi di elementi su un 60 pari
se questo era un array piatto su un 64-bit
macchina virtuale se ogni elemento era un
puntatore di oggetti che è 256 giga di RAM
giusto così per aggiornare una struttura di dati
questo enorme abbiamo solo due al massimo do
operazioni a sette bit e sette array
accede per aggiornare qualsiasi cosa in questo
enorme struttura dati dobbiamo solo
sostituire sette matrici quindi spero che questo
ti ha convinto che quella strutturale
la condivisione è davvero fantastica, ok ora
si ottiene l’idea quindi questo è come questo sia
come stiamo andando in grado di giocare a questo
gioco così ora che abbiamo i dati
strutture che sono adatte a rappresentare
valori immutabili possiamo fare davvero
roba fresca con interfacce utente e così ho
scrisse una biblioteca chiamata ohm e cosa io
è stato detto che possiamo accoppiare questo
script di chiusura caso che ha un adatto
libreria della struttura dati persistente e noi
può accoppiarlo con reagire e reagire
è relativamente nuovo sulla scena a
libreria per renderlo in realtà non
fare MBC è molto focalizzato su
rendering ma il modo in cui loro
l’algoritmo funziona è estremamente adatto a
associazione con strutture dati persistenti
quindi il modo in cui reagiscono reagisce
un po ‘ come quando lo usi sei come
questo sembra orientato agli oggetti ma in realtà
è orientato agli oggetti come se fosse funzionale
programmatore ha dovuto scrivere una biblioteca in un
ostinato e stile, quindi , in modo efficace
ti consente di fare i tuoi dati
che puoi fingere si presume come tuo
stato dell’app è possibile applicare una funzione e
quindi reagire genererà più dati e
questo è ciò che viene chiamato il Dom virtuale così
reagire in realtà non cambia nulla
crea crea una nuova struttura dati
quindi se ho dei dati non è in tempo
0 e ho applicare una funzione ottengo i dati
ricerca che rappresenta la mia interfaccia in
ora 0 se aggiorno i dati non lo facciamo
distruggi i vecchi dati, giusto non lo siamo
distruggendo i vecchi dati siamo semplicemente nuovi
dati che rappresentano il nuovo stato di
l’applicazione al momento in cui posso applicare
la stessa funzione e ora ho l’interfaccia utente
al tempo 1
quindi ciò che reagisce fa per noi è questo
calcola il diff
porta la rappresentazione virtuale con
l’interfaccia utente dovrebbe assomigliare e
calcola il set minimo di modifiche a
effettivamente fare al DOM e lo fa
questo in modo efficiente è come se fosse pigro e
i calcoli del sottoalbero sono solo
guarda a cosa ha bisogno di guardare e così via
ma quello che è bello è questo
succede se I flip v-0 e v1 reazione sarà
gratuitamente dammi il set inverso di
cambia proprio è solo gratuito perché
questo è solo il modo in cui la differenza funziona bene
quindi posso tornare indietro nel tempo e io no
non è necessario scrivere alcun codice per questo
reagire solo ci dà il tempo di viaggio da
definizione da parte del modo in cui si lavora
potrebbe essere scettico, ho intenzione di mostrare un
demo e la demo è piuttosto fresco così così
davvero quello che fa è il tuo componente
albero assomiglia a questo e e
però e reagire e il modo in cui reagiscono
rende trattabile è che loro
semplificare ciò che viene diff in modo da te
posso immaginare il ragazzo blu come div e
qui vediamo oh è un div in uno e a
tempo zero ed è un divot al momento uno
e ci sentiamo come se nulla fosse cambiato
lì poi scendiamo nei bambini
e vediamo oh ora abbiamo due paragrafi
tag bene non hanno un aspetto diverso e
poi siamo scesi nei bambini e noi
vedere oh c’era un c’era una spanna e
poi un tag font ma hanno cambiato posto
e quindi qual è ciò che è loro
l’algoritmo lo fa semplicemente per muoversi
quei due nodi Dom proprio così e ancora
ma ancora una volta questo dovrebbe mostrarti che noi
può andare in entrambe le direzioni
direzione giusta ed è guidato dai dati
quindi vediamo una demo di questo così una volta
capito che quei dati persistenti
strutture e reagire ad un buon accoppiamento I
era come se mi chiedessi quanto sarebbe stato difficile
per annullare, quindi ho fatto lo stile MVC
programmi per un tempo molto lungo e io
odio davvero fare disfare se lo hai mai fatto
guardato Cocos annullare gestore se tu
il numero uno è difficile da ottenere anche in modo corretto
se si pianifica per l’ ammodernamento anticipato
annullare su un oggetto esistente o Ian
buona fortuna che tu sappia qualunque cosa sia
non succederà
ma se inizi con un funzionale
modello tu puoi puoi io
ha aggiunto annullare così ho preso il tipo di
applicazione NVC di riferimento tradizionale
che deve fare MBC non è molto
interessante ma ho detto quanto sarebbe stato difficile
essere per me per aggiungere annullare ad un esistente
sistema e quindi fondamentalmente c’è
cinque questo è come cinque linee di codice I
ho scritto cinque righe di codice che ho avuto
versione esistente di fare MBC in ohm
già così ho scritto cinque righe di codice
e poi ho ottenuto questo, quindi posso farlo
andare andare per andare a così posso fare clic qui posso
passare le schede posso cancellare completato come
questo posso non so perché lo faresti
Cammina un gatto ma solo per divertimento così quassù
vedi che non è lento, questo è lontano
più veloce di 60 frame al secondo così tu
sapere 60 fotogrammi al secondo è come 16
millisecondi, quindi posso fare clic su Annulla
e non dovevo pianificare in anticipo
quello giusto non c’era pianificazione in anticipo
per questo questo è falso
completamente per aver detto che lo farò
rappresenta il mio stato dell’app come con
strutture dati persistenti che lascerò
reagire calcolare le modifiche al
Dom così potresti pensare bene a disfare chi
ci tiene che è davvero carina
bello ma forse la tua app non ha bisogno
disfare ma pensare all’errore gestendo cosa
succede quando tu quando non puoi
comunicare al server e hai bisogno
per tornare indietro così che cosa fai guardo
il programma di qualcuno e vedere oh loro avevano
per ripristinare manualmente lo stato dell’app o
dire che un cliente ha un errore, giusto cosa
puoi fare in questo modello che puoi
in realtà puoi effettivamente serializzare il
gli ultimi 50 passaggi inviarlo al tuo server e
riprodurlo è banale, proprio come te
non è necessario scrivere codice per fare tutto questo
queste cose che vogliamo fare in giro
gestione degli errori e ripristino di questi
anche cadere dalla capacità di viaggiare
liberamente nel tempo così io
parla di più delle cose che ho fatto
ma penso che sia più divertente da demo
qualcosa che qualcun altro ha fatto così
è stato un da uno degli sviluppatori di
Ableton Live mi ha attraversato di corsa
post sul blog e lui era come va bene che
suona bene ecco un piccolo giocattolo giocattolo NBC
app e ha annullato e ha detto che sono
Farò qualcosa di meno giocattolo come perché
Non credo davvero che David Nolan sia lui
sembra intelligente ma sembra questo
sembra troppa magia, così ha detto io
voglio costruire un editor 64 x 64 pixel
e volevo vedere quanto impegno fosse
prenderò per me per aggiungere annullare rifare e
quindi come un’anteprima del viaggio nel tempo
diritto alla mia app e lo sarà ancora
semplice quindi qui abbiamo il suo pixel
editore quindi questo è il suo non l’ho scritto
questo è qualcun altro così ho posso
posso scegliere alcuni colori qui posso disegnare a
piccolo circolo qui a destra tu
vedere tutti gli eventi accumulati in questo modo
va bene così se noti a sinistra posso
scrub ed è ed è solo andando
terzino destro sopra la linea del tempo che possiamo
muoverti avanti nel tempo così questo
l’immagine è in realtà un vettore persistente
che ha 4096 valori distinti proprio così
ha codificato 4096 pezzi individuali di
stato della domanda proprio così tra ciascuno
passo avresti dovuto pensare che dovremmo
replicare tutti i quattrocento 96 96 valori
ma ti ho spiegato su vettori resistenti
lavoro non è vero quindi anche se io anche se
Clicco anche se clicco in questo modo e io
Sto cadendo proprio così
differenza tra questa e questa
è come se forse fosse forse
sono quattro o cinque matrici proprio se
non c’è non c’è molta differenza
o strutture di dati persistenti naturalmente
rappresentare la cosa piuttosto interessante del Delta
anche lui è in grado di farlo qui
cosa davvero interessante, perché è così
codificato all’interno di um all’interno di questi
strutture dati persistenti che fanno cose
come produrre una gif animata da cosa
Ho appena disegnato di nuovo banale banale da fare
beh probabilmente ti stai chiedendo bene
quanto codice ha preso così questo è
l’intero questo è in realtà tutto il codice
è come meno di 50 linee questo è il
tutto ciò che puoi quasi se sei se
sei se sei in prima fila tu
può davvero leggerlo e penso che sia così
abbastanza sorprendente questo include annullare rifare
e l’ anteprima del viaggio nel tempo così io
penso che sia davvero fantastico
diminuzione radicale della complessità, se lo hai
mai fatto annullare prima di molto meno di a
editor di pixel sai che non è molto divertente
anche questo è interessante
probabilmente stai pensando bene quanto
la memoria fa davvero questo, forse e
forse sei come va bene, sembra
sarà buono ma davvero quanto
la memoria ci vuole così
Ho fatto un po ‘di cose un po’
test della memoria utilizzando lo sviluppatore di Chrome
strumenti profiler di calore e così via
snapshot dell’applicazione quando questo
inizia e inizia a circa 3,8
megabyte di memoria consumati
quello che ho fatto è stato detto bene
Prenderò un array JavaScript che sono
cercherò di sapere array di 4096 dimensioni
Ci metterò delle corde e lo sono
cambierò un valore ovviamente con
l’array JavaScript tutto quello che posso fare è
copialo ogni volta in modo da copiarlo 100
tempi con uno diverso e diverso
valore ovunque che consuma circa 1,7
megabyte di memoria per contenere un 100
vediamo distinte immagini pixel a sinistra
che facendo la stessa cosa con a
vettore persistente da 0,2 megabyte proprio così
Non so che cosa sia quella volta 8 9 è
9 volte quasi un ordine di grandezza
più piccola è la quantità di memoria
consumato è abbastanza bello ed efficiente
nel tempo e nello spazio quindi non ho intenzione di dire
Io se non l’hai visto prima di me
consiglio vivamente di provarlo
disponibile su github non so come
molte persone qui hanno familiarità con
chiamato il tuo script o la chiusura però
queste idee sono estremamente portabili
altre lingue, per esempio so che
i ragazzi della Scala stanno usando Scala j / se
Scala ha dati persistenti molto buoni
strutture ho visto alcuni fantastici demo
dove Scala j s + reagisce perfettamente
se sei un programmatore JavaScript tu
può fare quello che sto dimostrando, così c’è
un fantastico non non siamo fantastici, lo sono
solo la mia libreria ma è solo esportazione
script di chiusura per essere consumato da
I consumatori di JavaScript quindi forse sei dentro
JavaScript e non puoi o forse lo sei
in CoffeeScript
giusto non so cosa stai usando ma
vuoi le strutture dati ma tu
non vogliamo dover adottare la lingua in modo
Le esportazioni Mori sono molto evidenti
modo tutti i dati persistenti
strutture così come il tutto
libreria standard per manipolarli
così tante persone in realtà lo so
stanno effettivamente usando Mori nella loro
app lato client perché li vogliono
vogliono essere in grado di accoppiare reagire
con strutture dati immutabili perché
reagire di nuovo diventa molto meglio se tu
coppia con strutture dati immutabili così
questo è tutto ciò che ho avuto oggi, penso
Porterò alcune domande
funziona con e vediamo
quadri o è invece spento usando
un framework MVC quindi è quello che ero
cercando di suggerire in modo da poter appena ti ho
sapere che le persone sono dispiaciute la domanda è stata
questo sostituisce i quadri MVC o il can
lo usi con i framework MVC così loro
sono in un certo senso o ortogonali quindi cosa?
Sto dicendo che puoi fare come puoi
avere l’architettura MVC che puoi ancora
avere modelli che rappresentano un dominio
puoi avere controller che
coordinare tra una vista e il dominio
va bene, ma invece di avere
i modelli mutabili sono controller mutabili
e le visualizzazioni mutevoli è così che puoi
sostituire ogni parte di quella pila con
immutabili cose immutabili così persone
li ho suonati con la brace che ho visto
qualche esperienza con la brace come hai ottenuto
Ember più un modello immutabile te
puoi farlo di nuovo è più è
andando a richiedere alcuni disimparare però
giusto ci sono un sacco di cose che
le persone fanno in questi sistemi tradizionali
sono come tipo di nuoto sono dalla parte del torto
direzione
scusa scomparso quindi chi possiede la modella
del quadro MVC ha ovviamente il suo
propria copia del modello e questo è
mantenendo una cronologia delle versioni di quelli
modella il nostro come ci sono due sistemi
interagendo l’un l’ altro così questi sono
quelli sono ortogonali proprio così io
ho cercato di dimostrare con quello che ero
fare è che sono stato in grado di costruire il
due DS per fare l’applicazione MVC è l’annullamento
una cosa a parte il lavoro che è
completamente separato se non vuoi
disfare non devi farlo penso
c’è qualcuno dietro di te
menzionato all’inizio che avevi
tonnellate è cacao iOS e certificati e
Mac hai provato o hai pensato
circa se è possibile ordinare
questo per tipo di cellulare nativo o altro
quadri quindi vale sicuramente la pena
sperimentando perché così il
la domanda è stata fatta è stata questa
applicato a come Android o iOS, così è
sicuramente vale la pena sperimentare
iOS è un po ‘più facile in realtà solo
usare reagire ma questo è perché um OS 10
e iOS 7 OS 10 non conformisti e io sempre
hanno un ora esportare nucleo JavaScript in modo
da cui puoi direttamente legare
javascript in una direttiva nativa c così io
pensa che ci siano un sacco di cose interessanti
potrebbe fare lì letteralmente solo caricando
reagire e avere reagire manipolare
Oggetti Objective C.
c’è qualche tipo di caso in realtà
aggrava il comportamento del del
reagire rom struttura sono le cose dove
si sarebbe sicuramente stare lontano da esso I
significa così vuol dire che è come è
è piuttosto intenso lo dirò
come se benefici dal veloce che vedi
sicuramente lo stesso che chiuderlo
benefici di shitting JavaScript
motori concessi intendo un sacco di lavoro è
reagire per farlo funzionare anche se
quelle cose non sono presenti e uguali
con lo script di chiusura testiamo più lentamente
Motori JavaScript ma lo sarà
più lento di un array mutating se
c’è qualcosa che stai facendo dove tu
solo bisogno di come mutare qualcosa fallo
infatti infatti il pixel-based
editor cosa fa quando Blitz
destra
sta solo mutando la tela che non abbiamo
non abbiamo bisogno di ottenere nel modo di che
quindi parte di ciò che sto suggerendo è questo
funziona meglio quando tu quando questo è il tuo
il dominio usa il tuo modello non lo fai
bisogno di questo per come ad alte prestazioni
gli algoritmi rispondono a una domanda
e grazie mille David grazie
una finale funzionale
quello che si chiama questo discorso sarà
un po ‘collegato a questo, ma penso di essere io
voglio dare questo tipo di variazione
di questo discorso un contesto più ampio e
in realtà questo discorso potrebbe essere chiamato te
Conoscere l’immutabilità interagire con l’interattività
e clojurescript ma onestamente potrebbe
si chiama interattività immutabilità e
inserire la lingua della scelta esso
non importa davvero la cosa che sono
assicurato qui sta comunicando il
principi non una lingua specifica così
Fino a poco tempo fa ero impiegato al New
York Times per circa quattro anni fa
sviluppo front-end lì e quello era
un sacco di divertimento nel mio background
interfacce utente di tutti i tipi di utente
interfacce in cui ho fatto interfacce utente
cacao e Java e C ++ e ho speso
più tempo facendoli in JavaScript I
ora lavoro a cognate echt e sono eccitato
a tale proposito
affini X un posto divertente perché loro sono
probabilmente di tutte le cose che prendono il
mutabilità come una sorta di centrale
affittuario di tutte le cose che progettano
entrambi sapete che c’è una specie di steward
hanno chiuso la lingua che
abbraccia l’immutabilità e a
soluzione di database piuttosto interessante
chiamato atomico che sottolinea anche
immutabilità, ma voglio parlare di più
in particolare sull’immutabilità nel
contesto delle interfacce utente così
programmazione orientata agli oggetti di un utente
interfacce sorta di venuto per essere quasi
nello stesso tempo intendo che gli oggetti lo hanno fatto
di apparire alla fine degli anni ’60 ma noi davvero
non è stato fino a chiacchiere fino al
variante con cui siamo più familiari
è venuto per essere e allo stesso tempo
l’interfaccia utente moderna è venuto a
si questa è l’immagine di alcuni bambini che giocano
con un piccolo sistema di talk come sai
Xerox PARC se puoi accendere un
immagine parlata di piccole dimensioni oggi c’è molto
fantastica versione open-source di small
parlare chiamato squittio puoi installarlo
puoi scrivere chiacchiere su di esso se tu
aprire il browser di sistema che consente
tu per vedere tutte le classi che sono
coinvolto nell’intero sistema che vorresti
probabilmente incontrano le parole Model View
controller giusto
quindi è abbastanza selvaggio, quindi
lo sai che non lo so
l’immagine era probabilmente la fonte dei bambini
la metà degli anni ’70, quindi sono 30 anni di MVC
e le persone hanno il codice ha optato per questo termine
quando parlano di web-based
anche i sistemi, ma fondamentalmente l’ idea
è stato il primo familiare di trig Vereen skog
e Adelle Goldberg a Xerox PARC in
1979 e ha avuto un tempo estremamente lungo
ombra i concetti di base sono ancora
prevalente oggi se lo fai
sviluppo front-end
Non importa se tu lo sei
è il targeting per iOS Android JavaScript MVC
un modo molto popolare per organizzare l’ uso
interfacce e questo perché penso a
un livello molto astratto MC MVC è un
estremamente suona la separazione delle preoccupazioni
ma le implementazioni lasciano molto da essere
desiderato
non siamo davvero avanzati molto lontano
inoltre là di quello che si avvicinò con
quel PARC di Xerox che è piuttosto triste
dato che ha 30 anni e il
cosa che farò domande qui sono io
credo che possiamo ottenere tutti i benefici
dei sistemi MVC tradizionali ma possiamo
eliminare questa cosa che non mi piace
sull’implementazione che è quella
le ambasciate sono costruite sopra
punti metallici e probabilmente lo sei
pensando come hai potuto farlo come può
ottieni tutti i vantaggi di NBC e
eliminare qualcosa che quasi tutti
ambasciate moderni hanno che è quella
sono costruiti in cima allo stato
oggetti così da gettare la nostra chiave inglese in questo
storia della programmazione dell’interfaccia utente però quale
gioca in questo discorso perché lo siamo
sarà una specie di enfatizzazione del web
i browser sono inventati da Tim berners-lee
questa cosa si chiama il browser web nel
fine anni ’80 su una macchina successiva, quindi a
il tempo aveva uno dei più potenti
Strutture MVC il prossimo passo alla fine
divenne cacao che ora è anche tutti
sa a causa di iOS ma lui lui
ha preso questo ricco sistema desktop MVC e lui
costruito il primo browser web al mondo
browser e l’idea dietro i browser web
non volevo creare un utente ricco
interfacce Voglio un documento di collegamento ipertestuale
su una rete era l’ unica cosa
era destinato a farlo
testuale hyperlinked
documenti che sono resi proprio lì
era no, non aveva senso risolvere il
ricco problema di interfaccia utente che è qui
non quello non era quello non era un obiettivo esso
era un obiettivo completamente non così non lo faccio
pensa di aver visto per la prima volta un futuro in cui la maggior parte
le persone interagiscono o no, ma molte altre
le persone interagiscono con il web attraverso il
documento modello oggetto se ne hai fatto
se hai fatto un lavoro serio su
web questo è più o meno il motivo per cui la tua vita
è terribile
perché il modello dell’oggetto documento è
fondamentalmente sui documenti non lo era
sulle interfacce utente non si tratta
eventi, voglio dire, queste cose non lo sono
significato per loro sono stati progettati i Dom
progettato per risolvere un problema diverso
e così quando guardo il tipo di
panorama di ciò che le persone stanno facendo
browser Web e DOM e JavaScript
lo sai che sembra davvero così
destra
Alan Kay ha questa grande analogia
ray dice troppo spesso l’ architettura del software
assomiglia un po ‘alle Grandi Piramidi
è molto impressionante da guardare
ma non c’è un percorso concettuale profondo
l’idea qui è che sai che è così
andando a prendere migliaia di persone
centinaia di anni per costruire proprio così
spesso il software si sente così e il
e fa questa affermazione interessante che
spesso ciò che manca dal software
lo sviluppo è una piccola e semplice idea e
allora puoi avere un radicalmente diverso
architettura puoi avere molto di più
posizionamento efficiente di architettura
materiale e sottolinea che lo era
l’arco proprio questo estremamente semplice
concetto ha permesso agli umani di costruire un
tipo di edificio completamente diverso
e quindi penso che tu sappia che lo faremo
I DUI stiamo cercando questo arco I
non penso che l’abbiamo ancora trovato MVC è un
buon punto di partenza ma penso che ci sia
qualcosa manca così orientato agli oggetti
i programmatori hanno avuto la possibilità che arrivassero
con MVC
è fantastico ma abbiamo bisogno di qualcosa
più e così forse dovremmo guardare a cosa
i programmatori funzionali lo stanno facendo
c’è una cosa chiamata funzionale
programmazione reattiva FR
è ancora un’area molto attiva di
ricerca se ti piace Haskell
avremmo sentito parlare di questo è abbastanza
accademico e hanno molti problemi
hanno ancora bisogno di risolvere per farlo
lavoro c’è uno stato orientato agli oggetti
Affronta questo che sta diventando davvero
popolare ora chiamato Rx da Microsoft rx
Java rx cacao tutto questo roba il giusto
è l’ approccio orientato agli oggetti su FRP
è molto interessante sicuramente fantastico
per coordinare eventi e complessi
flussi di lavoro asincroni comunque
in realtà non risolve il problema che
tu incontri gli occhi che dicevano come facciamo noi
affrontare il fatto che la fine al
bordi del nostro tipo di sistema che dobbiamo
rendere qualcosa che l’utente deve vedere
qualcosa se vieni da go the
vai al linguaggio di programmazione o se sei se
sei nella medicazione di chiusura
questa cosa si chiama core async allora hai
probabilmente sentito parlare di CSP questo è Toni
l’ astrazione della puttana, ma di nuovo lo è anche
un linguaggio di coordinamento che non ha
davvero affrontare il problema di rendering così
potresti star pensando bene, forse MVC lo è
forse non c’è altro, forse
forse siamo solo bloccati con lo stato
oggetti e dobbiamo rizzare
queste piramidi di interfacce utente che
sono difficili da modificare difficili da estendere
per mantenere forse non c’è arco e io
e discuterò dall’avere
giocato a lungo con la chiusura
tempo e questo è probabilmente vecchio cappello per
per le persone che hanno giocato in giro con
Haskell o Scala ma c’è stato un
incredibile quantità di incredibile pratica
la ricerca accademica è entrata in qualcosa
chiamato strutture dati persistenti che
Non ho intenzione di presumere che voi ragazzi
ho sentito parlare e voglio parlare
loro ora perché penso che ci danno un
opportunità di semplificare il coordinamento
di interfacce utente e stato giusto quali
penso che sia la fonte principale di
complessità e un utente complicato
l’interfaccia è che ne hai un sacco
componenti stateful come fai
coordinarli come sai chi è
cambiando lo stato e penso
struttura dati persistente possono ordinare di
rendilo trattabile quindi lo mostrerò
alcune diapositive non sono mie diapositive
su come persistenti strutture dati
lavoro solo per
hai una specie di senso su come sono capace
per venire a compiere da circa a mostrare
queste diapositive sono state fatte da Zack
in una scuola di packer che è davvero
fantastico tipo di coder come un codice
gli scrittori si ritirano a New York e così via
rubare le sue diapositive in modo funzionale
mi ha dato nei dati
programmatori funzionali come i dati loro
come valori immutabili non mutabili
oggetti ogni volta che cambi qualcosa
cambia tutto ciò che intendi sei
andando a modificare qualcosa per ottenere un nuovo
valore che non cambierai il
cose originali quindi non è come si ottiene
un array e tu muti la cosa al
secondo indice il vecchio valore che loro
rappresentare è ormai andato per sempre non lo facciamo
così è così che si trova la parola
proviene persistente e la cosa interessante
che sto per dimostrare è quello
iniziando nei primi anni 2000 a causa di a
carta di Phil Bagwell ora capiamo
come puoi farlo in modo efficiente così sono
assumendo che tutti abbiano visto una lista collegata
e potresti dire che è così noioso
è come se conoscessi le strutture dati 101
ma le liste collegate sono davvero interessanti
proprietà se li tratti in un mutabile
modo che dimostra come
le strutture di dati persistenti funzionano quelle
usiamo in chiusura e quelli che sono
usato in Scala e Haskell quindi un link
elenca che hai qualcosa in testa
e punta ad altri elementi in questo
lista collegata
bene la cosa carina di una lista collegata
è se le icone se io se ho una nuova testa
e indico X ciò che è bello di questo
è che ho due valori distinti, giusto ma
questi due valori distinti effettivamente condividono
tre elementi che sono in realtà
condividere la memoria qui così anche se Y
rappresenta la lista con la Y
sulla testa rappresenta un particolare
valore non ha distrutto il valore che X
rappresenta ora puoi immaginare che io
potrebbe ottenere la coda di X e quindi contro Z
sulla testa di questo e ora ho
tre valori distinti ma tutti condividono
più del 50% di memoria, proprio questo è un
proprietà davvero interessante delle liste collegate
condivisione strutturale così struttura di condivisione
ci dà l’ efficienza dello spazio
ma ci dà anche computazione
efficienza quando aggiorniamo qualcosa
significa che possiamo aggiornare qualcosa
senza dover aggiornare senza nuovi
copy-on-write quindi questo è un tradizionale
la tecnica è che se ho dei dati
Struttura e voglio aggiornarlo ed io
voglio sembrare avere una mutabilità noi
semplicemente copia l’intera cosa, naturalmente
quando arrivi ad un milione di milioni
elementi giusti che non sono efficienti quindi
le strutture dati persistenti ci consentono di
aggiornare una grande struttura di dati in a
modo funzionale e stiamo andando a
minimizzare la copia e potrebbe non esserlo
ovvio come farlo e ho intenzione di farlo
mostrarti così riempire Bagwell che purtroppo
morto il cappello si avvicinò con questa cosa
ha chiamato la mappa dell’array hash prova che ha scritto
questo documento in come 2002 all’EPFL dove
Scala è stato creato ed è venuto fuori
con una variante mutabile ricca di lettura Hickey
la carta era come questa è fantastica
solo modificandolo un pochino possiamo
creare una variante immutabile di questi dati
struttura quindi ho intenzione di mostrare un più semplice
versione una variante più semplice non l’hash
mappa array prova perché è un po ‘
complicato ma ho intenzione di mostrarti
come possiamo avere un array immutabile come
tipo quindi ha tutte le proprietà che noi
è piaciuto su matrici è accesso casuale
come un ArrayList puoi, se puoi
aggiungi alla fine in modo efficiente possibile
puoi puoi dividerli in modo efficiente
e così via così l’idea qui è quella
i dati vivono nelle foglie e nel modo
quello che un albero vettoriale bitmap
in realtà è solo un albero di array giusto
è solo un albero di array ed è
sta per essere un albero prefissato che usiamo
per trovare un elemento particolare ma è
sarà un albero di prefissi bit a bit e
vediamo che aspetto ha, quindi facciamolo
scegli alcune dimensioni arbitrarie per i nostri nodi
array con quattro elementi a loro così
ogni elemento di quell’array punta
a un altro array della stessa dimensione
ogni matrice di quel punto a un altro
quattro array di quella dimensione e poi
finalmente abbiamo colpito i nodi foglia dove il nostro
i valori vivono e qui abbiamo solo il
numeri che rappresentano gli indici
giusto così come troviamo qualcosa
questo e abbiamo detto che era un albero prefissato
quindi cerca di indicizzarlo, quindi immagina di volerlo
per trovare il centesimo sesto elemento in
questo in questa rappresentazione bene
il numero ha una rappresentazione binaria e
possiamo mascherare i bit per arrivare a dove
dobbiamo essere mascherati dai primi due
bit questo è l’indice 1 quindi scendiamo
quaggiù mascheriamo i prossimi due bit
questo è l’indice 2 è di nuovo 2 ed è
finalmente due proprio così per poter ottenere
là cosa dovevo fare devo fare
tre ricerche di array e alcune maschere di bit
questa è roba che la JVM e
i moderni motori JavaScript che compila
verso il basso conoscete le istruzioni x86
questo sarà molto veloce e allora
sull’aggiornamento quindi se voglio aggiornare
cosa devo aggiornare devo solo
aggiorna il percorso e tutti i nodi sul
percorso per la cosa che ho bisogno di cambiare e
qui ho intenzione di sostituire 106 con
la stringa pippo
tutti quegli altri nodi, giusto che non lo siano
sta per cambiare e quindi probabilmente lo farai
pensando bene, sai cosa sono quattro
al quarto cosa è questo in modo che se noi
se abbiamo il vettore e la dimensione del nodo
quattro possiamo contenere 256 elementi così è
sembra ok così come si scopre se tu
fare un sacco di test empirici 32 è un
grandi dimensioni è una dimensione in cui cercare
e gli aggiornamenti sono una specie di un rapporto ottimale
questa è l’immagine di una borsa con la carta
quello ha preso la variante di Rich e loro
ulteriormente esteso solo per darti un
il senso di quanto sia bello immaginare realmente
un vettore persistente che ha 32 livelli
di nota sono dispiaciuti sette livelli di nodi
dove ogni elemento è 32 largo che è 32
al settimo potere
sono 34 miliardi di elementi su un 60 pari
se questo era un array piatto su un 64-bit
macchina virtuale se ogni elemento era un
puntatore di oggetti che è 256 giga di RAM
giusto così per aggiornare una struttura di dati
questo enorme abbiamo solo due al massimo do
operazioni a sette bit e sette array
accede per aggiornare qualsiasi cosa in questo
enorme struttura dati dobbiamo solo
sostituire sette matrici quindi spero che questo
ti ha convinto che quella strutturale
la condivisione è davvero fantastica, ok ora
si ottiene l’idea quindi questo è come questo sia
come stiamo andando in grado di giocare a questo
gioco così ora che abbiamo i dati
strutture che sono adatte a rappresentare
valori immutabili possiamo fare davvero
roba fresca con interfacce utente e così ho
scrisse una biblioteca chiamata ohm e cosa io
è stato detto che possiamo accoppiare questo
script di chiusura caso che ha un adatto
libreria della struttura dati persistente e noi
può accoppiarlo con reagire e reagire
è relativamente nuovo sulla scena a
libreria per renderlo in realtà non
fare MBC è molto focalizzato su
rendering ma il modo in cui loro
l’algoritmo funziona è estremamente adatto a
associazione con strutture dati persistenti
quindi il modo in cui reagiscono reagisce
un po ‘ come quando lo usi sei come
questo sembra orientato agli oggetti ma in realtà
è orientato agli oggetti come se fosse funzionale
programmatore ha dovuto scrivere una biblioteca in un
ostinato e stile, quindi , in modo efficace
ti consente di fare i tuoi dati
che puoi fingere si presume come tuo
stato dell’app è possibile applicare una funzione e
quindi reagire genererà più dati e
questo è ciò che viene chiamato il Dom virtuale così
reagire in realtà non cambia nulla
crea crea una nuova struttura dati
quindi se ho dei dati non è in tempo
0 e ho applicare una funzione ottengo i dati
ricerca che rappresenta la mia interfaccia in
ora 0 se aggiorno i dati non lo facciamo
distruggi i vecchi dati, giusto non lo siamo
distruggendo i vecchi dati siamo semplicemente nuovi
dati che rappresentano il nuovo stato di
l’applicazione al momento in cui posso applicare
la stessa funzione e ora ho l’interfaccia utente
al tempo 1
quindi ciò che reagisce fa per noi è questo
calcola il diff
porta la rappresentazione virtuale con
l’interfaccia utente dovrebbe assomigliare e
calcola il set minimo di modifiche a
effettivamente fare al DOM e lo fa
questo in modo efficiente è come se fosse pigro e
i calcoli del sottoalbero sono solo
guarda a cosa ha bisogno di guardare e così via
ma quello che è bello è questo
succede se I flip v-0 e v1 reazione sarà
gratuitamente dammi il set inverso di
cambia proprio è solo gratuito perché
questo è solo il modo in cui la differenza funziona bene
quindi posso tornare indietro nel tempo e io no
non è necessario scrivere alcun codice per questo
reagire solo ci dà il tempo di viaggio da
definizione da parte del modo in cui si lavora
potrebbe essere scettico, ho intenzione di mostrare un
demo e la demo è piuttosto fresco così così
davvero quello che fa è il tuo componente
albero assomiglia a questo e e
però e reagire e il modo in cui reagiscono
rende trattabile è che loro
semplificare ciò che viene diff in modo da te
posso immaginare il ragazzo blu come div e
qui vediamo oh è un div in uno e a
tempo zero ed è un divot al momento uno
e ci sentiamo come se nulla fosse cambiato
lì poi scendiamo nei bambini
e vediamo oh ora abbiamo due paragrafi
tag bene non hanno un aspetto diverso e
poi siamo scesi nei bambini e noi
vedere oh c’era un c’era una spanna e
poi un tag font ma hanno cambiato posto
e quindi qual è ciò che è loro
l’algoritmo lo fa semplicemente per muoversi
quei due nodi Dom proprio così e ancora
ma ancora una volta questo dovrebbe mostrarti che noi
può andare in entrambe le direzioni
direzione giusta ed è guidato dai dati
quindi vediamo una demo di questo così una volta
capito che quei dati persistenti
strutture e reagire ad un buon accoppiamento I
era come se mi chiedessi quanto sarebbe stato difficile
per annullare, quindi ho fatto lo stile MVC
programmi per un tempo molto lungo e io
odio davvero fare disfare se lo hai mai fatto
guardato Cocos annullare gestore se tu
il numero uno è difficile da ottenere anche in modo corretto
se si pianifica per l’ ammodernamento anticipato
annullare su un oggetto esistente o Ian
buona fortuna che tu sappia qualunque cosa sia
non succederà
ma se inizi con un funzionale
modello tu puoi puoi io
ha aggiunto annullare così ho preso il tipo di
applicazione NVC di riferimento tradizionale
che deve fare MBC non è molto
interessante ma ho detto quanto sarebbe stato difficile
essere per me per aggiungere annullare ad un esistente
sistema e quindi fondamentalmente c’è
cinque questo è come cinque linee di codice I
ho scritto cinque righe di codice che ho avuto
versione esistente di fare MBC in ohm
già così ho scritto cinque righe di codice
e poi ho ottenuto questo, quindi posso farlo
andare andare per andare a così posso fare clic qui posso
passare le schede posso cancellare completato come
questo posso non so perché lo faresti
Cammina un gatto ma solo per divertimento così quassù
vedi che non è lento, questo è lontano
più veloce di 60 frame al secondo così tu
sapere 60 fotogrammi al secondo è come 16
millisecondi, quindi posso fare clic su Annulla
e non dovevo pianificare in anticipo
quello giusto non c’era pianificazione in anticipo
per questo questo è falso
completamente per aver detto che lo farò
rappresenta il mio stato dell’app come con
strutture dati persistenti che lascerò
reagire calcolare le modifiche al
Dom così potresti pensare bene a disfare chi
ci tiene che è davvero carina
bello ma forse la tua app non ha bisogno
disfare ma pensare all’errore gestendo cosa
succede quando tu quando non puoi
comunicare al server e hai bisogno
per tornare indietro così che cosa fai guardo
il programma di qualcuno e vedere oh loro avevano
per ripristinare manualmente lo stato dell’app o
dire che un cliente ha un errore, giusto cosa
puoi fare in questo modello che puoi
in realtà puoi effettivamente serializzare il
gli ultimi 50 passaggi inviarlo al tuo server e
riprodurlo è banale, proprio come te
non è necessario scrivere codice per fare tutto questo
queste cose che vogliamo fare in giro
gestione degli errori e ripristino di questi
anche cadere dalla capacità di viaggiare
liberamente nel tempo così io
parla di più delle cose che ho fatto
ma penso che sia più divertente da demo
qualcosa che qualcun altro ha fatto così
è stato un da uno degli sviluppatori di
Ableton Live mi ha attraversato di corsa
post sul blog e lui era come va bene che
suona bene ecco un piccolo giocattolo giocattolo NBC
app e ha annullato e ha detto che sono
Farò qualcosa di meno giocattolo come perché
Non credo davvero che David Nolan sia lui
sembra intelligente ma sembra questo
sembra troppa magia, così ha detto io
voglio costruire un editor 64 x 64 pixel
e volevo vedere quanto impegno fosse
prenderò per me per aggiungere annullare rifare e
quindi come un’anteprima del viaggio nel tempo
diritto alla mia app e lo sarà ancora
semplice quindi qui abbiamo il suo pixel
editore quindi questo è il suo non l’ho scritto
questo è qualcun altro così ho posso
posso scegliere alcuni colori qui posso disegnare a
piccolo circolo qui a destra tu
vedere tutti gli eventi accumulati in questo modo
va bene così se noti a sinistra posso
scrub ed è ed è solo andando
terzino destro sopra la linea del tempo che possiamo
muoverti avanti nel tempo così questo
l’immagine è in realtà un vettore persistente
che ha 4096 valori distinti proprio così
ha codificato 4096 pezzi individuali di
stato della domanda proprio così tra ciascuno
passo avresti dovuto pensare che dovremmo
replicare tutti i quattrocento 96 96 valori
ma ti ho spiegato su vettori resistenti
lavoro non è vero quindi anche se io anche se
Clicco anche se clicco in questo modo e io
Sto cadendo proprio così
differenza tra questa e questa
è come se forse fosse forse
sono quattro o cinque matrici proprio se
non c’è non c’è molta differenza
o strutture di dati persistenti naturalmente
rappresentare la cosa piuttosto interessante del Delta
anche lui è in grado di farlo qui
cosa davvero interessante, perché è così
codificato all’interno di um all’interno di questi
strutture dati persistenti che fanno cose
come produrre una gif animata da cosa
Ho appena disegnato di nuovo banale banale da fare
beh probabilmente ti stai chiedendo bene
quanto codice ha preso così questo è
l’intero questo è in realtà tutto il codice
è come meno di 50 linee questo è il
tutto ciò che puoi quasi se sei se
sei se sei in prima fila tu
può davvero leggerlo e penso che sia così
abbastanza sorprendente questo include annullare rifare
e l’ anteprima del viaggio nel tempo così io
penso che sia davvero fantastico
diminuzione radicale della complessità, se lo hai
mai fatto annullare prima di molto meno di a
editor di pixel sai che non è molto divertente
anche questo è interessante
probabilmente stai pensando bene quanto
la memoria fa davvero questo, forse e
forse sei come va bene, sembra
sarà buono ma davvero quanto
la memoria ci vuole così
Ho fatto un po ‘di cose un po’
test della memoria utilizzando lo sviluppatore di Chrome
strumenti profiler di calore e così via
snapshot dell’applicazione quando questo
inizia e inizia a circa 3,8
megabyte di memoria consumati
quello che ho fatto è stato detto bene
Prenderò un array JavaScript che sono
cercherò di sapere array di 4096 dimensioni
Ci metterò delle corde e lo sono
cambierò un valore ovviamente con
l’array JavaScript tutto quello che posso fare è
copialo ogni volta in modo da copiarlo 100
tempi con uno diverso e diverso
valore ovunque che consuma circa 1,7
megabyte di memoria per contenere un 100
vediamo distinte immagini pixel a sinistra
che facendo la stessa cosa con a
vettore persistente da 0,2 megabyte proprio così
Non so che cosa sia quella volta 8 9 è
9 volte quasi un ordine di grandezza
più piccola è la quantità di memoria
consumato è abbastanza bello ed efficiente
nel tempo e nello spazio quindi non ho intenzione di dire
Io se non l’hai visto prima di me
consiglio vivamente di provarlo
disponibile su github non so come
molte persone qui hanno familiarità con
chiamato il tuo script o la chiusura però
queste idee sono estremamente portabili
altre lingue, per esempio so che
i ragazzi della Scala stanno usando Scala j / se
Scala ha dati persistenti molto buoni
strutture ho visto alcuni fantastici demo
dove Scala j s + reagisce perfettamente
se sei un programmatore JavaScript tu
può fare quello che sto dimostrando, così c’è
un fantastico non non siamo fantastici, lo sono
solo la mia libreria ma è solo esportazione
script di chiusura per essere consumato da
I consumatori di JavaScript quindi forse sei dentro
JavaScript e non puoi o forse lo sei
in CoffeeScript
giusto non so cosa stai usando ma
vuoi le strutture dati ma tu
non vogliamo dover adottare la lingua in modo
Le esportazioni Mori sono molto evidenti
modo tutti i dati persistenti
strutture così come il tutto
libreria standard per manipolarli
così tante persone in realtà lo so
stanno effettivamente usando Mori nella loro
app lato client perché li vogliono
vogliono essere in grado di accoppiare reagire
con strutture dati immutabili perché
reagire di nuovo diventa molto meglio se tu
coppia con strutture dati immutabili così
questo è tutto ciò che ho avuto oggi, penso
Porterò alcune domande
funziona con e vediamo
quadri o è invece spento usando
un framework MVC quindi è quello che ero
cercando di suggerire in modo da poter appena ti ho
sapere che le persone sono dispiaciute la domanda è stata
questo sostituisce i quadri MVC o il can
lo usi con i framework MVC così loro
sono in un certo senso o ortogonali quindi cosa?
Sto dicendo che puoi fare come puoi
avere l’architettura MVC che puoi ancora
avere modelli che rappresentano un dominio
puoi avere controller che
coordinare tra una vista e il dominio
va bene, ma invece di avere
i modelli mutabili sono controller mutabili
e le visualizzazioni mutevoli è così che puoi
sostituire ogni parte di quella pila con
immutabili cose immutabili così persone
li ho suonati con la brace che ho visto
qualche esperienza con la brace come hai ottenuto
Ember più un modello immutabile te
puoi farlo di nuovo è più è
andando a richiedere alcuni disimparare però
giusto ci sono un sacco di cose che
le persone fanno in questi sistemi tradizionali
sono come tipo di nuoto sono dalla parte del torto
direzione
scusa scomparso quindi chi possiede la modella
del quadro MVC ha ovviamente il suo
propria copia del modello e questo è
mantenendo una cronologia delle versioni di quelli
modella il nostro come ci sono due sistemi
interagendo l’un l’ altro così questi sono
quelli sono ortogonali proprio così io
ho cercato di dimostrare con quello che ero
fare è che sono stato in grado di costruire il
due DS per fare l’applicazione MVC è l’annullamento
una cosa a parte il lavoro che è
completamente separato se non vuoi
disfare non devi farlo penso
c’è qualcuno dietro di te
menzionato all’inizio che avevi
tonnellate è cacao iOS e certificati e
Mac hai provato o hai pensato
circa se è possibile ordinare
questo per tipo di cellulare nativo o altro
quadri quindi vale sicuramente la pena
sperimentando perché così il
la domanda è stata fatta è stata questa
applicato a come Android o iOS, così è
sicuramente vale la pena sperimentare
iOS è un po ‘più facile in realtà solo
usare reagire ma questo è perché um OS 10
e iOS 7 OS 10 non conformisti e io sempre
hanno un ora esportare nucleo JavaScript in modo
da cui puoi direttamente legare
javascript in una direttiva nativa c così io
pensa che ci siano un sacco di cose interessanti
potrebbe fare lì letteralmente solo caricando
reagire e avere reagire manipolare
Oggetti Objective C.
c’è qualche tipo di caso in realtà
aggrava il comportamento del del
reagire rom struttura sono le cose dove
si sarebbe sicuramente stare lontano da esso I
significa così vuol dire che è come è
è piuttosto intenso lo dirò
come se benefici dal veloce che vedi
sicuramente lo stesso che chiuderlo
benefici di shitting JavaScript
motori concessi intendo un sacco di lavoro è
reagire per farlo funzionare anche se
quelle cose non sono presenti e uguali
con lo script di chiusura testiamo più lentamente
Motori JavaScript ma lo sarà
più lento di un array mutating se
c’è qualcosa che stai facendo dove tu
solo bisogno di come mutare qualcosa fallo
infatti infatti il pixel-based
editor cosa fa quando Blitz
destra
sta solo mutando la tela che non abbiamo
non abbiamo bisogno di ottenere nel modo di che
quindi parte di ciò che sto suggerendo è questo
funziona meglio quando tu quando questo è il tuo
il dominio usa il tuo modello non lo fai
bisogno di questo per come ad alte prestazioni
gli algoritmi rispondono a una domanda
e grazie mille David grazie
Please follow and like us: