Best practice asynkron bildeopplastningDette er et tema jeg vender tilbake til i nesten alle prosjekt jeg gjør. Det er en av de tingene som er på lik linje med betalingsløsning, det skal inn i mange prosjekt, og hver gang er det en jobb for å få det bra. Siden jeg har forsøkt så mange varianter gjennom tiden, hadde det vært interessant å se hva dere bruker å gjøre, og erfaringer dere har hatt. Jeg vil dele problematikken opp i tre punkter.
1) En god løsning krever at man bruker et bibliotek for å få til den asynkrone opplevelsen. Jeg har brukt plupload ajax-upload uploadify , laget egne ajax-uploader og noen andre bibliotek. Problematikken her er stort sett på cross-browser. Plupload har mulighet for flere teknologier med fallback: html5, flash, silverlight m.f. Jeg skulle gjerne vært foruten flash, men det er noen ganger behov for å laste direkte til aws, og da er det mye hack for å få til dette med bare javascript. Har dere et “dette bruker jeg nesten hver gang” bibliotek å anbefale, eller erfaringer med de jeg har forsøkt? 2) Prosessering og lagring. Her har jeg brukt paperclip men bruker nå for det meste carrierwave og fog. Jeg bruker CDN, men for de fleste prosjektene har jeg en eller flere buckets på amazon sonen ‘eu-west’ på irland. Problemene som dukker opp her er i forbindelse med større filer. For å takle større filer har jeg nå gått over til at punkt 1) laster rett til en bucket på aws. Deretter tar carrierwave denne ned i en bakgrunds-jobb, prosesserer den (f.eks. lager thumbs og andre størrelser) for å så laste versjonene opp i nye bøtter før jeg sletter orginalfilen. Dette er en fin måte å unngå at controlleren blir stående å ta resurser på langsomme prosesser, eventuelt timeout, men det er også mange steg og kilder til feil. For å oppdatere browseren, f.eks. med en melding om prosesses fremgang og en thumbnail til slutt må jeg nå bruke socket-teknologi for å gi følelsen av at ting skjer i brukergrensersnittet. Her er jeg på jakt etter best practice for store filer. Også erfaringer rundt nevnte biibliotek eventuelt andre jeg ikke har forsøkt. 3) Rask visning. Ved bruk av buckets på Irland føler jeg fortsatt at tiden er for treg. Bruk av CDN er et eget kapittel og her er jeg interessert i å høre hvilke leverandører folk bruker, er fornøyd med evt misfornøyd med. Her hadde det også vært interessant å lære hva folk bruker for å pre-rendre bilder i browseren. Jeg vet at Facebook loader det neste bilde i et album mens du ser på det første. Når du ser på det neste vil Facebook loade de 2 neste. Deretter enda flere etterhvert som Facebook forstår at det er stor sjangse for at du vil se på de neste. Dette er det punktet jeg har minst erfaring med. Og det hadde vært supert med innspill på valg av CDN, caching og pre-loading før visning. Det ble et langt innlegg, men dette er noe jeg vil lære mest mulig om, det er ABC, brukes overalt, men likevel en jungel. Jeg hører gjerne om erfaringer rundt helt andre vinklinger rundt denne problematikken. Jeg har blant annet sett på transloadit men jeg vil gjerne beholde mer kontroll. Samtidig søker jeg å gjøre mye selv i håndverkets ånd. Håper på innspill – god helg!
Vist 174 ganger. Følges av 3 personer. | ||
Kommentarer
Vi bruker Tootsie, som vi har laget selv. (Origo bruker Flash til opplastingen, men vi skal gå over til HTML5 når vi har tid.)
Har du testet Google Cloud storage? Skal visst være litt kjappere enn S3 og Cloudfront.
Takk for tips. Jeg har ikke testet Google Cloud storgage, det får bli det neste eksperimentet.
Står litt om det her , ser jo lovende ut.