Spracovanie aktualizácií prijatých cez websocket. Vytváranie niečoho viac

12.03.2019

Pravidlá boli jednoduché. Každý používateľ si mohol vybrať jednu zo 16 farieb a namaľovať ňou jeden pixel kdekoľvek na plátne. Bolo možné namaľovať toľko pixelov, koľko ste chceli a akýmikoľvek farbami, ale aby ste prefarbili ďalší pixel, museli ste počkať 5 minút.

Pravda, pravidlá hovorili: „Koordináciou s ostatnými dokážete vytvoriť oveľa viac, ako keby ste konali sami.

To, čo sa stalo počas nasledujúcich 72 hodín, organizátorov šokovalo. Toto sa objavilo na prázdnom plátne:

Každý pixel na plátne bol umiestnený ručne. Každá ikona, každá vlajka, každý mém bol starostlivo vytvorený stovkami tisíc ľudí, ktorí nemali nič spoločné okrem internetového pripojenia. Čiže tak či onak, ale to, čo sa stalo na Reddite, možno právom považovať za zrod umenia.

Ako sa to všetko stalo

Nie je možné to opísať niekoľkými slovami. Na plátne sa odohralo nespočetné množstvo drám - bitky, bitky a vojny, niekedy ani nie je jasné, z akého dôvodu. Boli vedené na malých fórach, v súkromných chatoch, bolo ich veľmi veľa a udiali sa naraz, takže nebolo možné všetko sledovať. Vo všeobecnosti bolo plátno vysledované večné dejiny o troch silách, ktoré ľudstvo potrebuje na vytvorenie.

Tvorcovia

Ako prví prišli tvorcovia. Boli to umelci, pre ktorých má čisté plátno neodolateľnú príťažlivosť.

Tvorcovia začali pixely náhodne prefarbovať, len aby videli, čo dokážu. Preto prvé kresby vyzerali skôr rockové umenie– umelci práve začínali rozťahovať krídla.

Pomerne rýchlo si uvedomili, že pracovať samostatne a umiestniť iba jeden pixel každých 5-10 minút, nie je možné vytvoriť nič významné. Niekto im určite zničí prácu. Aby vytvorili niečo viac, musia spolupracovať.

A potom niekto navrhol kreslenie na mriežku, ktorá by jasne ukázala, kde je potrebné namaľovať ďalší pixel, aby sa získal koherentný obraz. Takže v ľavej dolnej časti plátna sa objavil Dickbutt - slávny internetový mém, plod tínedžerského zmyslu pre humor. Stalo sa prvým spoločným dielom.

Tvorcovia však nezostali len pri tom. Do Dickbutta začali pridávať rôzne prvky, maľovať ho rôznymi farbami a dokonca sa ho pokúšali premeniť na Dickbutterflyho. Za týmto hlúpym nápadom bol náznak blížiaceho sa tvorivého tsunami.

Nestalo sa tak však okamžite. Tvorcovia boli opojení ich silou. Vedľa Dickbutta sa objavil Pokémon Charmander, v ktorom namiesto labky začal rásť člen a potom ďalší dvaja.

Už to nebol dizajn. Niektorí tvorcovia sa zúfalo pokúšali odstrániť provokatívne doplnky, ktoré volali po „čistom“ umení, no iní zotrvali. Ale nebolo to tam.

Ukázalo sa, že príliš veľa slobody vedie k chaosu. Kreativita potrebuje hranice rovnako ako slobodu. Keď niekto môže umiestniť akýkoľvek pixel kdekoľvek, ako to nemôže viesť k chaosu?

Strážcovia

Tento problém bol veľmi rýchlo vyriešený iným typom užívateľov – chovateľmi. Prišli s jediným cieľom – dobyť celý svet.

Po vytvorení frakcií podľa farby začali dobývať priestor tým, že ho namaľovali určitou farbou. Jednou z prvých a najväčších bola frakcia Blue Corner. Objavil sa v pravom dolnom rohu a rozšíril sa ako mor. Jej nasledovníci hlásali, že takto by mali zvlniť celý priestor plátna. Pixel po pixeli začali svoju predstavu prenášať do reality a čoskoro zachytili obrovské plochy.

Blue Corner nebol vo svojom úsilí sám. Na druhej strane plátna sa objavila ďalšia skupina – Červený kútik (červený roh). Jeho účastníci uviedli, že sú prívržencami ľavice Politické názory. Ďalšia skupina - Green Lattice (zelená mriežka) - prevzala všadeprítomné prelínanie zelených a bielych pixelov. Ukázalo sa, že je vysoko efektívny, pretože musel maľovať o polovicu menej pixelov ako ostatné frakcie.

Brankári išli k tvorcom frontálnym útokom. Charmander sa stal prvým miestom bitky. Po zistení, že Modrý kútik začal zabíjať Pokémonov modrými pixelmi, si tvorcovia uvedomili hrozbu a ukončili príbuzné vojny.

Bránili sa a každý modrý pixel nahradili vlastným. Ale sily neboli rovnaké. Vďaka svojmu odhodlaniu Blue Corner zhromaždil oveľa väčšiu armádu ako tvorcovia. A jediné, čo tvorcom v takejto situácii ostávalo, bolo prosiť o život.

A nejako sa to otočilo. V Modrom rohu sa začala debata o ich úlohe v tvorivý proces. Jeden účastník položil otázku: „Keďže náš príliv nevyhnutne úplne ovládne svet, mali by sme prejaviť milosrdenstvo iným formám umenia, s ktorými sa stretávame?

Bola to otázka, s ktorou sa skôr či neskôr stretla každá frakcia. Pri všetkej ich expanzívnej horlivosti, čo mali robiť s umením, ktoré im stálo v ceste?

Toto bol zlomový bod. Bezduché frakcie sa zmenili na obrancov.

Ale ešte to neskončilo

Vo svete plnom dravých farieb sa tvorcovia mohli vrátiť k svojim výtvorom. Pridávaním jedného prvku za druhým ich začali robiť komplexnejšie. Pomocou trojpixelových fontov začali písať texty. Jedným z najznámejších výtvorov bol prequel Star Wars.

Tvorcovia sa spojili v skupinách pracujúcich na spoločnom projekte. Zdieľali medzi sebou stratégie a vzorce. Jednou z najúspešnejších bola skupina, ktorá vytvorila panel Windows 95 s tlačidlom Štart v rohu.

Iní vytvorili blok srdca ako v starých videohrách ako Zelda. Málokto sa pustil do tohto projektu, no rýchlo sa k nim pridali ďalší a výsledkom bolo, že srdiečka, namaľované vo farbách rôznych vlajok, sa natiahli na polovicu plátna.

Ďalšia skupina znovu vytvorila Van Goghovu Hviezdnu noc.

Nie všetko však išlo hladko. Z ochrancov, ktorí kedysi vítali tvorbu umeleckých diel, sa stali módni tyrani. Začali špecifikovať, čo môže byť vytvorené a čo nie. Začalo to krátko predtým, ako tvorcovia začali tvoriť podľa vlastných pravidiel.

Frakcie sa na seba obrátili a požadovali, aby sa ich nasledovníci postavili na stranu v epických bitkách. Nemali čas venovať pozornosť žalostným prosbám tvorcov, ktorí chceli získať súhlas pre myšlienky nového umenia.

Boje medzi obrancami sa rozhoreli. Živí vysielatelia Twitch povzbudzovali svojich sledovateľov, aby zaútočili na Blue Corner a Purple. Pripravovali sa bojové plány. Vyzývali na emócie.

Vyskytli sa dokonca aj fingované útoky, pri ktorých prívrženci rovnakej farby umiestnili pixely súpera do svojich vlastných, aby sa mohli sťažovať na porušenie a zaútočiť späť.

Najväčším problémom však bolo prísne pravidlo – plátno sa nedá zväčšiť. Bojujúce frakcie aj tvorcovia si začali uvedomovať, že na nové umenie jednoducho nebudú mať priestor.

Od samého začiatku sa na plátne objavovali vlajky rôznych krajinách. Rástli a narážali do seba. Medzi vlajkami Nemecka a Francúzska sa strhla skutočná epická bitka. Bolo jasné, že na rozvoj nových priestorov je potrebný sprostredkovateľ.

Zrazu sa svet, ktorý na začiatku unikol primitívnym nájazdom, pripravil na rozsiahlu vojnu. Zúfalé pokusy vyriešiť problém diplomaciou vyšli naprázdno. Stretávajú sa na chatoch, vodcovia tvorcov a obrancov sa navzájom obviňujú.

Potrebovali sme slizača, s ktorým by každý súhlasil.

Torpédoborce

Na internetovej stránke 4chan upozornil na to, čo sa deje na Reddite. A nemohli prejsť. Ich používatelia si zvolili farbu ich srdcu najbližšiu – čiernu. Stali sa Prázdnotou.

Ako sa slza pomaly šíri po povrchu, tak sa v strede plátna začali objavovať čierne pixely, ktoré ničili všetko, čo jej stálo v ceste.

Najprv sa s nimi pokúšali uzavrieť spojenectvo iné frakcie, ktoré naivne verili, že diplomacia bude fungovať. Ale zlyhali, pretože Prázdnota bola iná.

Prázdnota nebola žiadnym ochrancom. Na rozdiel od iných frakcií nepreukázala žiadnu lojalitu k umeniu. Stúpenci Prázdnoty praktizovali deštruktívne rovnostárstvo pod heslom „Void všetko pohltí“. S ostatnými nenadviazali kontakt. Chceli len natrieť celý svet na čierno.

A to bolo presne to, čo sa vyžadovalo. Na pokraji vyhynutia sa všetci členovia projektu spojili, aby bojovali proti Prázdnote, aby zachránili svoje umenie.

Ale prázdnotu nebolo také ľahké poraziť, pretože to bolo potrebné. Všetko bolo potrebné zničiť, aby sa z popola znovu zrodilo nové umenie, najlepšie. A bez Prázdnoty to nebolo možné.

Prázdnota sa teda stala katalyzátorom pre vznik najväčšieho umeleckého diela.

Od samého začiatku bol tvrdohlavý boj o centrálnu časť plátna. Tvorcovia si toto územie nárokovali pre svoje diela. Najprv sa o to pokúšali pomocou ikon. Potom v koordinovanom pokuse o vytvorenie hranolu ako na obale Album Pink Floyd zadná strana Mesiac."

Ale Prázdnota zjedla všetko. Vytvorené kreácie jeden za druhým len rozohrievali jej dravú chuť na chaos.

A predsa to bolo presne to, čo bolo potrebné. Tým, že The Void zničil umenie, prinútil používateľov prísť s niečím lepším. Vedeli, že môžu poraziť čierne monštrum. Potrebujú len nápad s dobrým potenciálom, ktorý pritiahne dostatok nasledovníkov.

A tou myšlienkou bola americká vlajka.

V posledný deň projektu sa všetci zišli, aby raz a navždy zahnali prázdnotu. Vznikla koalícia z ľudí, ktorí by sa inak navzájom roztrhali – z prívržencov a odporcov Trumpa, z demokratov a republikánov, z Američanov a Európanov.

Spojili sa, aby spolu vytvorili niečo v tomto malom kúte internetu, čím dokázali, že v ére, kde sa takáto spolupráca zdá byť nemožná, to stále dokážu.

Starovekí mali pravdu

Krátko nato sa experiment Reddit skončil. Dnes ho sprevádza množstvo príbehov rozprávaných v desiatkach chatovacích miestností. Každé umelecké dielo vytvorené v projekte bolo pokryté stovkami nových, z ktorých na finálnom plátne zostalo len niekoľko.

Najprekvapivejšie však je, že napriek anonymite a nedostatku zákazov na konečnom plátne neboli žiadne rasistické alebo mizantropické symboly. Bol to krásny okruh umenia, života a smrti. A nebol prvý v našej histórii.

Pred mnohými tisícročiami, keď bolo ľudstvo (to skutočné, nielen to na Reddite) ešte v plienkach, hinduistickí filozofi navrhli, že nebesia sa skladajú z troch súperiacich, no nevyhnutných božstiev: Brahma Stvoriteľ, Višnu Zachovateľ, a Shiva- Destroyer.

Ani bez jedného z nich by vesmír nemohol fungovať. Aby bolo svetlo, musí byť tma. Na existenciu života je potrebná smrť. Pre stvorenie a umenie musí existovať deštrukcia.

Niekoľko dní projektu ukázalo, že tento prístup sa ukázal ako prorocký. Najneuveriteľnejším spôsobom Reddit dokázal, že tvorba si vyžaduje prítomnosť všetkých troch komponentov.

Finálne plátno

Facebook

Twitter

Vreckové

LinkedIn

fb messenger

Nedá sa povedať, že 100% firemných vtipov na Deň humoru je úspešných a pútavých. Tento rok spustila správa Redditu Place, interaktívne grafické plátno s rozmermi 1000 x 1000 pixelov a sekciu, ktorá je mu venovaná. Predpokladalo sa, že členovia komunity budú toto plátno spoločne maľovať, ako sa im páči. V dôsledku toho sa to však zmenilo na bitku o Miesto, niekedy až na filozofickú konfrontáciu. Obyčajné kreslenie sa zmenilo na vzrušujúci sociálny experiment. Príbeh od začiatku do konca zdokumentoval blog Sudoscript.

Pravidlá Miesta boli jednoduché. Každý účastník si mohol vybrať jeden pixel zo 16 farieb a umiestniť ho kamkoľvek na plátno. Môžete umiestniť toľko pixelov, koľko ste chceli, no medzi každým umiestnením ste museli počkať 5 minút. Po 72 hodinách toto jednoduché pravidlá viedlo k vytvoreniu úžasného kolektívneho plátna:

Každý z vyššie uvedených pixelov bol umiestnený ručne. Každá ikona, každá vlajka, každý mém bol starostlivo vytvorený tisíckami ľudí, ktorí nemali nič spoločné okrem internetového pripojenia.

Počas tvorby sa odohralo nespočetné množstvo drám, nápadov, bojov, dokonca aj vojen. Ale vo všeobecnosti je história Miesta večná dráma o troch silách, ktoré ľudstvo potrebuje na vytváranie a vytváranie a vývoj technológií.

Tvorcovia

Najprv to boli tvorcovia. Išlo o umelcov, pre ktorých sa prázdne plátno javilo ako neodolateľná príležitosť. Prví umelci umiestňovali pixely náhodne, len aby videli, čo sa dá urobiť. V prvých minútach sa objavili prvé skice. Drsné a nezrelé pripomínali jaskynné maľby jaskyniarov.

Tvorcovia hneď videli, akú silu a potenciál skrývajú pixely. Ale keď pracovali samostatne, mohli umiestniť jeden pixel každých 5 alebo 10 minút. Tvorba zmysluplná kresba trvalo by to večnosť. Aby niečo nakreslili, museli spolupracovať.

Potom niekto prišiel s geniálnym nápadom použiť na kreslenie mriežku, ktorá by prekryla kresbu a ukázala, kde by mali byť ďalšie pixely. Prvým, kto prešiel týmto experimentom, bol známy mém anglicky hovoriaceho internetového Dickbutta. A obyvatelia Place sa pustili do práce: Dickbutt sa v priebehu niekoľkých minút zhmotnil v ľavom dolnom rohu plátna. Na Place sa objavil prvý výtvor kolektívnej tvorivosti.

Keď sa potom tvorcovia trochu opili možnosťami, objavil sa Pokémon Charmander, v ktorom sa namiesto nohy pomerne skoro objavil člen. A začal sa prvý konflikt: niektorí tvorcovia sa usilovne snažili upratať urážlivé kresby, iní však vytrvalo pridávali obscénne veci.

Tvorcovia stoja pred zásadným filozofickým problémom: priveľa slobody vedie k chaosu. Kreativita potrebuje obmedzovač, rovnako ako potrebuje slobodu.

obrancov

Miesto malo iný typ používateľov, ktorí sa museli vysporiadať presne s týmto problémom. Začali však s primitívnejšími cieľmi: dobytím sveta. Rozdelili sa do frakcií podľa farby a pokúsili sa dobyť Miesto. Jedným z prvých bol Modrý kútik. Vznikol v pravom dolnom rohu a šíril sa ako mor.

Ďalšia skupina založila Červený kút na opačnej strane plátna, priklonila sa k politickej ľavici. Iná skupina s názvom Zelená mriežka maľovala plátno cez pixel – zelené bunky preložené bielou farbou. Keďže museli maľovať iba polovicu pixelov, boli efektívnejšie ako ostatné frakcie.

Netrvalo dlho a frakcie sa stretli s tvorcami. Charmander sa stal jedným z prvých objektov bitky. Modrý roh začal maľovať Pokémonov modrými pixelmi a Tvorcovia prešli z „falických vojen“ (kto pritiahne viac členov) k vážnejšej hrozbe. Vzali sa do boja a namaľovali každý modrý pixel svojim vlastným. Kvantitatívna výhoda však nebola v ich prospech.

Creators sa teda vzdali na milosť víťazovi a nejako to ranilo city Blues. Objavili sa medzi nimi pochybnosti o svojej úlohe vo svete Miesta. „Naša vlna nevyhnutne pokryje celý svet, od okraja po okraj, ak prejavíme milosrdenstvo inému umeniu, s ktorým sa stretneme,“ spýtal sa jeden zo skupiny.

Každá z frakcií čelila tomuto problému. A všetci sa rozhodli uložiť ďalšie kresby. Farebné vlny teda začali obtekať kresby bez toho, aby ich premaľovali.

Toto bol zlomový bod. Bezduché farebné frakcie sa stali užitočnými obrancami.

Nie je to však šťastný koniec

Konečne boli nenásytné farebné vlny zastavené a Tvorcovia sa mohli vrátiť ku kreativite. Kresby boli čoraz ťažšie. Objavili sa texty napísané v pixeloch.

Tvorcovia sa zišli v malých skupinách a vytvorili podsekcie na Reddite, kde mohli diskutovať o návrhoch nákresov a stratégii. Jedna z najúspešnejších skupín nakreslila panel úloh v štýle Windows 95. Ďalšia načrtnutá Miesto so srdiečkami.

Potom prišiel Van Gogh.

Všetko však nebolo také jednoduché. Obrancovia sa zmenili na tyranov, ktorí diktovali štýl kresieb. Rozhodujú o tom, čo sa môže kresliť a čo nie. Frakcie si medzi sebou začali rozdeľovať užívateľov, volali po večierkoch, zatiaľ čo Tvorcovia čakali na schválenie nových nápadov.

Súboje medzi obrancami boli čoraz tvrdšie. Jeden streamer Twitch vyzval svojich nasledovníkov, aby zaútočili na BLU. Boli vyvinuté bojové stratégie. Nechýbali dokonca ani provokácie: fanúšikovia rovnakej farby si sami nakreslili pixely farby nepriateľa na svoje územie, aby mali zámienku na odvetný útok. Zatiaľ čo frakcie medzi sebou bojovali, Tvorcovia zistili, že nie je priestor na nové kresby.

Vlajky sa začali dvíhať rozdielne krajiny Ako rastú, nevyhnutne na seba narazia. Na území „nikoho“ sa napríklad stretli vlajky Nemecka a Francúzska.

Zdalo sa, že svet je na pokraji vojny. Všetky strany sa snažili konflikt vyriešiť diplomatickou cestou. Lídri Tvorcov a Obrancov sa bavili, no zvyčajne to skončilo vzájomným obviňovaním.

Miesto potrebovalo zloducha, proti ktorému by sa všetci ostatní mohli spojiť.

Torpédoborce

Prázdnota prišla.

Začalo to 4chan, najznámejšou obrazovou doskou na svete. Srandisti, ktorí ho obývali, si všimli, čo sa deje na Reddite a nemohli prejsť okolo. Stali sa Prázdnotou.

V strede Miesta začala rásť škvrna čiernych pixelov. Frakcie sa najskôr pokúšali uzavrieť pakt s Prázdnotou prostredníctvom diplomacie. Ale zlyhali, Prázdnota konala inak. Nepatrila medzi ochranárov, nestrážila umenie. Jej nasledovníci kázali, že Prázdnota zožerie všetko. Netvorili strany, chceli len natrieť celý svet na čierno.

Bol to presne ten kopanec do zadku, ktorý Miestu chýbal. Tvorcovia a obrancovia, tvárou v tvár spoločnej hrozbe, sa opäť spojili, aby zachránili umenie. Ale zmyslom Prázdnoty nebola len deštrukcia, nejako to dalo vzniknúť novému, lepšiemu umeniu.

Napríklad poloha v centre bola medzi tvorcami jednou z najkontroverznejších. A keď sa to zmenilo na čierne, ochrancovia si uvedomili, že budú musieť prísť s lepším nápadom, ktorý by zahŕňal dostatok nasledovníkov na boj s čiernym monštrom. Jednou z týchto myšlienok bola vlajka USA.

V posledný deň Place sa vytvorila najúžasnejšia koalícia na boj proti Prázdnote – Trumpoví fanúšikovia a Trumpovi odporcovia, republikáni a demokrati, Američania a Európania.

Experiment Reddit sa čoskoro skončil. Na konečnom plátne nebola ani jedna rasistická kresba, ani jeden symbol nenávisti.

Twitter

Vreckové

LinkedIn

fb messenger

Reddit otvoril stránku sebavyjadrenia na počesť aprílových bláznov, ale projekt, vytvorený ako vtip, sa stal akousi stenou pre kolektívne graffiti od účastníkov z celého sveta, čo ukazuje, akú stopu chcú zanechať v histórii.

1. apríla Reddit spustil projekt Place, stránku s prázdnym plátnom, na ktorú si každý používateľ fóra mohol nakresliť ľubovoľný obrázok. Umelci mali obmedzenia: každých päť minút mohli nakresliť len jeden pixel jednej zo 16 farieb a obmedzená bola aj veľkosť plátna. Na vrch nakreslených pixelov môžete nakresliť ďalšie (a potom môže prvý autor opäť nakresliť svoj vlastný pixel na pixel súpera), a preto si autori obrázkov a priori kolidujú. Ako je uvedené v popise plátna, projekt je navrhnutý pre spoločnú kreativitu - „Každý z vás môže vytvoriť niečo individuálne. Spolu môžete vytvoriť niečo viac."

Na začiatku projektu sa všetci doslova vrhli na plátno - každý pixel na ňom bol vyplnený. Používatelia najprv jednoducho strkali farbu do voľných pixelov, no potom sa začali formovať tímy, ktoré začali kresliť jeden z najjednoduchších možných nápadov, ktorý nájde podobne zmýšľajúcich ľudí – štátne vlajky. Čím viac používateľov na plátne pracovalo, tým zaujímavejšie a komplexné myšlienky prišlo im na um. A "The Place" sa vyvinulo z prvoaprílového projektu na miesto, kde sa používatelia z celého sveta stretávajú v skutočných komunitách, aby svetu niečo ukázali a podporili ich tvorbu od skupín nájazdníkov, ktorí chcú naozaj len nakresliť nejaký druh svojej vlastnej kresby.

Umiestnite počas prvých hodín prevádzky

"The Place" sa stalo online nástenkou, ale každá z nich je vytvorená veľmi ťažko. Napríklad na nakreslenie loga Linuxu s rozmermi 48 x 68 pixelov a jeho ochranu pred squattermi je potrebné, aby kreslilo súčasne 3 264 ľudí.

Používatelia sa spájajú, aby implementovali nápady, ktoré sú menšie a jednoduchšie, ale stále veľmi tímovo orientované, ako napríklad tento rad sŕdc s vlajkami rôznych krajín (a nielen): každý je zodpovedný za „svoje“ srdce, ale všetci spolu ľudia nevedomky tvoria jedno. tím.

A iní píšu celé plátna textu, napríklad ako táto skupina fanúšikov “ Hviezdne vojny“, ktorý napísal a udržiava slávny monológ najvyššieho kancelára Palpatina o Sithovi Darthovi Plagueisovi z tretej epizódy vesmírnej ságy.

Niektorí používatelia sa však sťažovali, že účastníci projektu namiesto seba „nasadili“ botov, ktorí každých päť minút automaticky aktualizujú pixel obsadený autorom. Napriek tomu, že pri kreslení každého pixelu musí používateľ zopakovať súbor akcií (napríklad výber určitej farby), niektorým sa podarilo obísť ochranný mechanizmus a vytvoriť roboty, ktoré im kreslia obrázky.

Sú však aj takí, ktorí stále vytvárajú špeciálne vlákna a snažia sa osloviť rovnako zmýšľajúcich ľudí, ktorí pomôžu nakresliť a zanechať pre budúce generácie niečo ako... zvracať Ricka Sancheza z karikatúry Ricka a Mortyho. vážne? Naozaj to nie sú roboti?

Po 72 hodinách práce bol projekt uzavretý. Správa zdroja poďakovala všetkým za účasť a za to, že sa ľudia spojili, „aby vytvorili niečo viac“.

Reddit sa často stáva miestom pre rôzne spoločenské aktivity. Napríklad nedávno smutní používatelia zdroja sa rozhodli opýtať, aké to je vstávať každý deň s úsmevom. A predtým čitatelia Redditu medzi sebou zdieľali príbehy o dievčatách. Na populárnom zdroji sedia nielen anonymní ľudia: nedávno herec niekoľko hodín odpovedal na otázky používateľov o filme „Trainspotting“.

Na začiatok bolo mimoriadne dôležité určiť požiadavky na aprílový projekt, pretože musel byť spustený bez „pretaktovania“, aby k nemu mali okamžite prístup všetci používatelia Redditu. Ak by nefungovala dokonale od samého začiatku, sotva by pritiahla pozornosť veľkého množstva ľudí.

    "Doska" musí mať 1000 x 1000 dlaždíc, aby vyzerala veľmi veľká.

    Všetci klienti musia byť synchronizovaní a musia zobrazovať rovnaký stav dosky. Koniec koncov, ak majú rôzni používatelia rôzne verzie, bude pre nich ťažké komunikovať.

    Musíte podporovať aspoň 100 000 používateľov súčasne.

    Používatelia môžu umiestniť jednu dlaždicu každých päť minút. Preto je potrebné udržiavať priemernú rýchlosť aktualizácie 100 000 dlaždíc za päť minút (333 aktualizácií za sekundu).

    Projekt by nemal negatívne ovplyvňovať prácu ostatných častí a funkcií lokality (aj keď je na r/Place vysoká návštevnosť).

  • V prípade neočakávaných prekážok alebo porúch je potrebné zabezpečiť flexibilnú konfiguráciu. To znamená, že ak je množstvo údajov príliš veľké alebo obnovovacia frekvencia príliš vysoká, musíte mať možnosť prispôsobiť veľkosť dosky a povolenú frekvenciu kreslenia za behu.

Backend

Rozhodnutia o implementácii

Hlavným problémom pri vytváraní backendu bola synchronizácia zobrazenia stavu dosky pre všetkých klientov. Bolo rozhodnuté, že klienti budú počúvať udalosti umiestňovania dlaždíc v reálnom čase a okamžite si vyžiadať stav celej dosky. Je prijateľné mať mierne zastaraný úplný stav, ak sa prihlásite na odber aktualizácií pred vygenerovaním úplného stavu. Keď klient dostane úplný stav, zobrazí všetky dlaždice, ktoré dostal počas čakania; všetky nasledujúce dlaždice musia byť zobrazené na hracej ploche hneď po ich prijatí.


Aby táto schéma fungovala, žiadosť plný stav dosky by mali bežať čo najrýchlejšie. Najprv sme chceli uložiť celú dosku na jednom riadku v Cassandre a nechať každú požiadavku len prečítať tento riadok. Formát pre každý stĺpec v tomto riadku bol:


(x, y): ('timestamp': epochms, 'author': user_name, 'color': color)

Ale keďže doska obsahuje milión dlaždíc, potrebovali sme prečítať milión stĺpcov. Na našom produkčnom klastri to trvalo až 30 sekúnd, čo bolo neprijateľné a mohlo by to viesť k nadmernému zaťaženiu Cassandry.


Potom sme sa rozhodli uložiť celú dosku v Redis. Zobrali sme bitové pole milióna štvorbitových čísel, z ktorých každé mohlo zakódovať štvorbitovú farbu, a súradnice x a y boli určené posunom (offset = x + 1000y) v bitovom poli. Na získanie úplného stavu dosky bolo potrebné prečítať celé bitové pole.


Dlaždice je možné aktualizovať aktualizáciou hodnôt pri konkrétnych posunoch (nie je potrebné blokovať alebo vykonávať celú procedúru čítania/aktualizácie/zápisu). Všetky podrobnosti však stále musia byť uložené v Cassandre, aby používatelia mohli zistiť, kto a kedy zverejnil jednotlivé dlaždice. Tiež sme plánovali použiť Cassandru na obnovenie dosky, keď Redis havaroval. Prečítanie celej dosky z nej trvalo necelých 100 ms, čo bolo celkom rýchle.


Tu je návod, ako sme uložili farby v Redis pomocou dosky 2x2 ako príklad:



Obávali sme sa, že by sme mohli naraziť na priepustnosť čítania na Redis. Ak sa veľa klientov pripájalo alebo aktualizovalo súčasne, potom všetci súčasne posielali požiadavky na získanie úplného stavu dosky. Keďže tabuľka bola zdieľaným globálnym štátom, samozrejmým riešením bolo použitie vyrovnávacej pamäte. Rozhodli sme sa pre cache na úrovni CDN (Fastly), pretože to bolo jednoduchšie na implementáciu a cache bola najbližšie ku klientom, čo skrátilo čas odozvy.


Požiadavky na stav celej dosky ukladal do vyrovnávacej pamäte Fastly s časovým limitom za sekundu. Zabrániť veľký početžiadostí, keď vyprší časový limit, použili sme hlavičku stale-while-revalidate. Rýchlo podporuje približne 33 POPs, ktoré sa ukladajú do vyrovnávacej pamäte nezávisle, takže sme očakávali, že za sekundu dostaneme až 33 žiadostí o stav celej dosky.


Na zverejňovanie aktualizácií pre všetkých klientov sme použili našu službu websocket. Predtým sme ho úspešne použili na podporu Reddit.Live s viac ako 100 000 súbežnými používateľmi na živé upozornenia na súkromné ​​správy a ďalšie funkcie. Služba bola tiež základným kameňom naše minulé prvoaprílové projekty – The Button a Robin. V prípade r/Place klienti podporovali pripojenia websocket, aby dostávali aktualizácie umiestnení dlaždíc v reálnom čase.

API

Získanie úplného stavu dosky


Najprv sa žiadosti dostali na Fastly. Ak mal platnú kópiu dosky, okamžite ju vrátil bez toho, aby kontaktoval aplikačné servery Reddit. Ak nie, alebo bola kópia príliš stará, aplikácia Reddit si prečítala celú tabuľu od Redis a vrátila ju Fastly, aby bola uložená do vyrovnávacej pamäte a vrátená klientovi.




Upozorňujeme, že rýchlosť žiadostí nikdy nedosiahla 33 za sekundu, t. j. ukladanie do vyrovnávacej pamäte pomocou Fastly bolo veľmi vysoké efektívny nástroj chráni aplikáciu Reddit pred väčšinou požiadaviek.



A keď sa žiadosti dostali do aplikácie, Redis reagoval veľmi rýchlo.

Kreslenie dlaždíc


Fázy kreslenia dlaždice:

  1. Časová pečiatka poslednej dlaždice umiestnenej používateľom sa číta z Cassandry. Ak to bolo pred menej ako piatimi minútami, nerobíme nič a používateľovi sa vráti chyba.
  2. Podrobnosti dlaždíc sú napísané Redisovi a Cassandre.
  3. Aktuálny čas je zaznamenaný v Cassandre ako posledný čas, keď používateľ umiestnil dlaždicu.
  4. Služba websocket odošle správu o novej dlaždici všetkým pripojeným klientom.

Aby sa zachovala prísna konzistentnosť, všetky zápisy a čítania v Cassandre sa vykonávali pomocou konzistentnej úrovne QUORUM .


V skutočnosti sme tu mali preteky, v ktorých používatelia mohli umiestniť viacero dlaždíc naraz. V etapách 1-3 nedošlo k blokovaniu, takže simultánne pokusy o kreslenie dlaždíc mohli prejsť testom v prvej etape a mohli byť vykreslené v druhej. Zdá sa, že niektorí používatelia našli túto chybu (alebo použili roboty, ktoré ignorovali limit frekvencie odosielania žiadostí) – a výsledkom bolo, že pomocou nej bolo umiestnených asi 15 000 dlaždíc (~0,09 % z celkového počtu).


Rýchlosť žiadostí a čas odozvy meraný aplikáciou Reddit:



Maximálna rýchlosť umiestnenia dlaždíc bola takmer 200 za sekundu. To je pod naším vypočítaným limitom 333 dlaždíc/s (priemer za predpokladu, že 100 000 používateľov umiestni svoje dlaždice každých päť minút).


Získanie podrobností o konkrétnej dlaždici


Pri vyžiadaní konkrétnych dlaždíc sa údaje čítali priamo z Cassandry.


Rýchlosť žiadostí a čas odozvy meraný aplikáciou Reddit:



Táto požiadavka sa ukázala ako veľmi populárna. Okrem bežných požiadaviek klientov ľudia napísali skripty na získanie celej dosky po jednej dlaždici. Keďže táto požiadavka nebola uložená do vyrovnávacej pamäte v CDN, všetky požiadavky obsluhovala aplikácia Reddit.



Čas odozvy na tieto požiadavky bol pomerne krátky a udržiaval sa na rovnakej úrovni počas trvania projektu.

Websockety

Nemáme samostatné metriky ukazujúce, ako r/Place ovplyvnilo výkon služby websocket. Hodnoty však môžeme odhadnúť porovnaním údajov pred začiatkom projektu a po jeho dokončení.


Celkový počet pripojení k službe websocket:



Základné zaťaženie pred spustením r/Place bolo asi 20 000 spojení, vrchol 100 000 spojení. Takže na vrchole sme pravdepodobne mali približne 80 000 používateľov súčasne pripojených k r/Place.


Priepustnosť služby websocket:



Pri špičkovom zaťažení na r/Place služba websocket prenášala cez 4 Gbps (150 Mbps na inštanciu, celkovo 24 inštancií).

Frontend: weboví a mobilní klienti

V procese vytvárania front-endu pre Place sme museli vyriešiť mnoho zložitých úloh súvisiacich s multiplatformovým vývojom. Chceli sme, aby projekt fungoval rovnako na všetkých hlavných platformách vrátane stolných počítačov a mobilných zariadení so systémom iOS a Android.


Používateľské rozhranie muselo vykonávať tri dôležité funkcie:

  1. Zobrazenie stavu dosky v reálnom čase.
  2. Umožnite používateľom interakciu s tabuľou.
  3. Pracujte na všetkých platformách vrátane mobilných aplikácií.

Hlavným objektom rozhrania bolo plátno a rozhranie Canvas API bolo na to ideálne. Použili sme prvok 1 000 x 1 000 a každá dlaždica bola nakreslená ako jeden pixel.

Kresba na plátno

Plátno muselo odrážať stav dosky v reálnom čase. Po načítaní stránky bolo potrebné nakresliť celú tabuľu a dokresliť aktualizácie prichádzajúce cez webové zásuvky. Prvok plátna, ktorý používa rozhranie CanvasRenderingContext2D, možno aktualizovať tromi spôsobmi:

  1. Nakreslite existujúci obrázok na plátno pomocou drawImage() .
  2. Kreslenie formulárov pomocou rôznych metód kreslenia formulárov. Napríklad fillRect() vyplní obdĺžnik nejakou farbou.
  3. Zostavte objekt ImageData a nakreslite ho na plátno pomocou putImageData() .

Prvá možnosť nám nevyhovovala, pretože sme nemali dosku v podobe hotového obrazu. Boli tu možnosti 2 a 3. Najjednoduchším spôsobom bolo aktualizovať jednotlivé dlaždice pomocou fillRect() : keď aktualizácia príde cez websocket, stačí nakresliť obdĺžnik 1x1 na pozíciu (x, y). Vo všeobecnosti metóda fungovala, ale nebola príliš vhodná na kreslenie počiatočný stav dosky. Metóda putImageData() bola oveľa lepšia: mohli sme určiť farbu každého pixelu v jednom objekte ImageData a nakresliť celé plátno naraz.

Kreslenie počiatočného stavu dosky

Použitie putImageData() vyžaduje definovať stav dosky ako Uint8ClampedArray , kde každá hodnota je osembitové číslo bez znamienka medzi 0 a 255. Každá hodnota predstavuje nejaký farebný kanál (červený, zelený, modrý, alfa) a každý pixel potrebuje štyri prvky v poli. Plátno 2x2 vyžaduje 16-bajtové pole, kde prvé štyri bajty predstavujú ľavý horný pixel plátna a posledné štyri bajty predstavujú pravý spodok.


Tu je návod, ako sú pixely plátna spojené s ich reprezentáciami Uint8ClampedArray:



Pre plátno nášho projektu sme potrebovali pole štyroch miliónov bajtov – 4 MB.


V backende je stav dosky uložený ako štvorbitové bitové pole. Každá farba je reprezentovaná číslom medzi 0 a 15, čo nám umožnilo zabaliť dva pixely do každého bajtu. Ak to chcete použiť na klientskom zariadení, musíte urobiť tri veci:

  1. Odovzdajte binárne údaje z nášho API klientovi.
  2. Rozbaľte dáta.
  3. Prevod 4-bitových farieb na 32-bitové.

Na prenos binárnych údajov sme použili rozhranie Fetch API v tých prehliadačoch, ktoré ho podporujú. A v tých, ktoré nepodporujú, použité XMLHttpRequest s responseType nastaveným na "arraybuffer" .


Binárne dáta prijaté z API obsahujú dva pixely v každom byte. Najmenší konštruktor TypedArray, ktorý sme mali, nám umožňuje pracovať s binárnymi údajmi vo forme jednobajtových jednotiek. Ich používanie na klientskych zariadeniach je však nepohodlné, preto sme dáta rozbalili, aby sa s nimi ľahšie pracovalo. Proces je jednoduchý: iterujeme zbalené dáta, vyberieme vysoké a nízke bity a potom ich skopírujeme do samostatných bajtov v inom poli.


Nakoniec bolo potrebné previesť štvorbitové farby na 32-bitové.



Štruktúra ImageData, ktorú sme potrebovali na použitie putImageData(), to vyžaduje konečný výsledok bol vo forme Uint8ClampedArray s bajtami kódujúcimi farebné kanály v poradí RGBA. To znamená, že sme museli urobiť ešte jedno rozbalenie, pričom sme každú farbu rozdelili na jednotlivé bajty kanála a umiestnili ich do správneho indexu. Nie je veľmi pohodlné robiť štyri zápisy na pixel. Našťastie bola aj iná možnosť.


Objekty TypedArray sú v podstate reprezentácie poľa ArrayBuffer. Je tu jedno upozornenie: viaceré inštancie TypedArray môžu čítať a zapisovať do rovnakej inštancie ArrayBuffer. Namiesto písania štyri hodnoty v osembitovom poli môžeme zapísať jednu hodnotu do 32-bitovej! Použitím Uint32Array na zápis sme boli schopní jednoducho aktualizovať farby dlaždíc jednoduchou aktualizáciou jedného indexu poľa. Je pravda, že sme museli uložiť našu farebnú paletu v poradí bajtov-obrátených bajtov (ABGR), aby bajty automaticky zapadli na správne miesta pri čítaní pomocou Uint8ClampedArray.


Spracovanie aktualizácií prijatých cez websocket

Metóda drawRect() bola vhodná na vykresľovanie aktualizácií po jednotlivých pixeloch tak, ako boli prijaté, mala však jednu slabinu: Veľké množstvo aktualizácií, ktoré prichádzajú v rovnakom čase, môže viesť k zaseknutiu prehliadačov. A pochopili sme, že aktualizácie stavu dosky môžu prísť veľmi často, takže problém bolo potrebné nejako vyriešiť.


Namiesto okamžitého opätovného vykresľovania plátna zakaždým, keď dostaneme aktualizáciu websocket, sme sa rozhodli urobiť to tak, aby aktualizácie websocket, ktoré prídu v rovnakom čase, mohli byť zoskupené a vykreslené hromadne. Na dosiahnutie tohto cieľa boli vykonané dve zmeny:

  1. Prestať používať drawRect() - našli sme pohodlný spôsob aktualizovať veľa pixelov naraz pomocou putImageData() .
  2. Prenos vykresľovania plátna do cyklu requestAnimationFrame.

Zabalením renderu do animačnej slučky sme boli schopní okamžite zapísať aktualizácie websocketu do ArrayBuffer a zároveň odložiť skutočné vykresľovanie. Všetky aktualizácie webových zásuviek prichádzajúce medzi snímkami (približne 16 ms) boli zbalené a vykreslené v rovnakom čase. Vďaka použitiu requestAnimationFrame , ak by vykresľovanie trvalo príliš dlho (dlhšie ako 16 ms), malo by to vplyv iba na obnovovaciu frekvenciu plátna (a nie na zníženie výkonu celého prehliadača).

Interakcia s plátnom

Je dôležité poznamenať, že plátno bolo potrebné na uľahčenie interakcie používateľov so systémom. Hlavným scenárom interakcie je umiestnenie dlaždíc na plátno.


Presné vykreslenie každého pixelu v mierke 1:1 by však bolo mimoriadne náročné a nevyhli by sme sa chybám. Takže sme potrebovali zoom (veľký!). Používatelia navyše potrebovali mať možnosť jednoducho sa pohybovať po plátne, pretože bolo pre väčšinu obrazoviek príliš veľké (najmä pri použití zoomu).

priblížiť

Keďže používatelia mohli umiestňovať dlaždice raz za päť minút, chyby pri umiestňovaní by boli pre nich obzvlášť frustrujúce. Bolo potrebné implementovať priblíženie takej násobnosti, aby dlaždica bola dostatočne veľká a dala sa ľahko umiestniť do Správne miesto. Toto bolo obzvlášť dôležité na zariadeniach s dotykovou obrazovkou.


Implementovali sme 40x priblíženie, to znamená, že každá dlaždica mala veľkosť 40x40. Zabalili sme prvok v

, na ktorý je použitá transformácia CSS: scale(40, 40). Bolo to skvelé riešenie na umiestnenie dlaždíc, ale sťažilo to vidieť tabuľu (najmä na malých obrazovkách), takže sme priblížili dve zastávky: 40x na kreslenie dlaždíc, 4x na prezeranie dosky.


Použitie CSS na škálovanie plátna uľahčilo oddelenie kódu zodpovedného za kreslenie dosky od kódu zodpovedného za škálovanie. Ale tento prístup má niekoľko nevýhod. Pri zmene mierky obrázka (plátna) prehliadače štandardne používajú algoritmy vyhladzovania obrázkov. V niektorých prípadoch to nespôsobuje nepríjemnosti, ale jednoducho ničí pixelovú grafiku a mení ju na mydlovú kašu. Dobrou správou je, že existuje vlastnosť CSS na vykresľovanie obrázkov, ktorá nám umožňuje „požiadať“ prehliadače, aby nepoužívali anti-aliasing. Zlou správou je, že nie všetky prehliadače túto funkciu plne podporujú.


Zoom rozostrenie:



Pre takéto prehliadače bolo potrebné nájsť iný spôsob škálovania. Vyššie som spomenul, že existujú tri spôsoby kreslenia na plátno. Prvý z nich, drawImage() , podporuje kreslenie existujúceho obrázka alebo iného plátna. Podporuje tiež zmenu mierky obrazu počas vykresľovania (zväčšovanie alebo zmenšovanie). Aj keď má zoomovanie rovnaké problémy s rozmazaním ako vyššie uvedené CSS, dajú sa vyriešiť všeobecnejšie z hľadiska podpory prehliadača odstránením príznaku CanvasRenderingContext2D.imageSmoothingEnabled.


Problém s rozmazaným plátnom sme teda vyriešili pridaním ďalšieho kroku do procesu vykresľovania. Aby sme to urobili, urobili sme ešte jeden prvok , ktorý má rovnakú veľkosť a polohu ako prvok kontajnera (to znamená viditeľná oblasť dosky). Po prekreslení plátna pomocou drawImage() sa jeho viditeľná časť nakreslí na nové plátno v požadovanej mierke. Keďže tento krok navyše mierne zvyšuje náklady na vykresľovanie, použili sme ho iba v prehliadačoch, ktoré nepodporujú vlastnosť CSS na vykresľovanie obrázkov.

Navigácia na plátne

Plátno je pekné veľký obraz, najmä pri priblížení, takže sme potrebovali vedieť sa v ňom pohybovať. Na úpravu polohy plátna na obrazovke sme použili rovnaký prístup ako v prípade škálovania: zabalili sme prvok inému

, na ktorý je použitá transformácia CSS: translate(x, y). Vďaka samostatnému divu sme mohli jednoducho ovládať poradie, v akom sa transformácie aplikovali na plátno, čo bolo potrebné na zabránenie pohybu „fotoaparátu“ pri zmene zoomu.


V dôsledku toho sme poskytli podporu rôzne cesty nastavenie polohy kamery:

  • "Kliknutie a potiahnutie" (kliknutie a potiahnutie alebo potiahnutie dotykom);
  • "Kliknutím premiestniť" (presunúť kliknutím);
  • navigácia pomocou klávesnice.

Každá z týchto metód sa implementuje inak.

"Kliknite a potiahnite"

Toto je hlavný spôsob navigácie. Uložili sme súradnice x a y udalosti mousedown. Pre každú z týchto udalostí sme našli posun polohy kurzora myši vzhľadom na počiatočnú pozíciu a potom sme tento posun pridali k existujúcemu posunu plátna. Pozícia kamery bola okamžite aktualizovaná, takže navigácia bola veľmi pohotová.

"Presunutie stlačením tlačidla"

Keď kliknete na dlaždicu, umiestni sa do stredu obrazovky. Aby sme implementovali tento mechanizmus, museli sme sledovať vzdialenosť medzi udalosťami mousedown a mouseup, aby sme oddelili „kliknutia“ od „pohybov“. Ak vzdialenosť, o ktorú sa myš pohla, nebola dostatočná na to, aby sa mohla považovať za „pohybujúcu sa“, poloha „kamery“ sa zmenila na základe rozdielu medzi polohou myši a bodom v strede obrazovky. Na rozdiel od predchádzajúcej navigačnej metódy bola poloha „kamery“ aktualizovaná pomocou funkcie easing. Namiesto okamžitého nastavenia novej pozície sme ju uložili ako „cieľ“. Vo vnútri animačnej slučky (rovnaká, ktorá sa používa na prekreslenie plátna) bola aktuálna poloha „kamery“ posunutá bližšie k cieľu pomocou funkcie easing. To umožnilo zbaviť sa efektu príliš prudkého pohybu.

Navigácia pomocou klávesnice

Na plátne bolo možné sa pohybovať pomocou klávesových šípok alebo WASD. Tieto klávesy ovládali vnútorný pohybový vektor. Ak nebolo stlačené žiadne z klávesov, potom mal predvolený vektor súradnice (0, 0). Stlačením ktoréhokoľvek z navigačných tlačidiel pridaných 1 k x alebo y. Napríklad, ak stlačíte "vpravo" a "hore", súradnice vektora budú (1, -1). Tento vektor sa potom použil vo vnútri animačnej slučky na pohyb „kamery“.


Počas animácie sa rýchlosť pohybu vypočítala v závislosti od úrovne priblíženia pomocou nasledujúceho vzorca:


Rýchlosť pohybu = maxZoom / aktuálnyZoom * násobiteľ rýchlosti

Keď bol zoom vypnutý, tlačidlá boli rýchlejšie a oveľa prirodzenejšie.


Potom bol vektor pohybu normalizovaný, vynásobený rýchlosťou pohybu a aplikovaný na aktuálnu polohu „kamery“. Normalizácia bola použitá na prispôsobenie rýchlosti diagonálnych a ortogonálnych pohybov. Nakoniec sme aplikovali funkciu nábehu na zmeny v samotnom pohybovom vektore. Tým sa vyhladili zmeny v smere a rýchlosti pohybu, takže sa „kamera“ veľmi pohybovala hladšie.

Podpora mobilných aplikácií

Pri vkladaní plátna do aplikácií pre iOS a Android sme narazili na určité ťažkosti. Najprv sme potrebovali overiť používateľa, aby mohol umiestniť dlaždice. Na rozdiel od webovej verzie, kde je autentifikácia založená na relácii, v mobilných aplikácií použili sme OAuth: v tomto prípade by aplikácie mali prihlásenému používateľovi poskytnúť WebView s prístupovým tokenom. Najbezpečnejším spôsobom, ako to implementovať, je vloženie hlavičiek autorizácie OAuth prostredníctvom volania JS z aplikácie do WebView. To by nám v prípade potreby umožnilo prispôsobiť ďalšie hlavičky. Potom už išlo len o analýzu hlavičiek autorizácie pri každom volaní API:


r.place.injectHeaders(('Oprávnenie': 'Nositeľ ’});

Vo verzii pre iOS sme dodatočne implementovali podporu pre upozornenia, keď bola dlaždica používateľa pripravená na umiestnenie na plátno. Keďže umiestnenie sa uskutočnilo výlučne vo WebView, museli sme implementovať spätné volanie natívnej aplikácie. Našťastie v systéme iOS 8 a novších verziách sa to robí jednoduchým volaním JS:


webkit.messageHandlers.tilePlacedHandler.postMessage(this.cooldown / 1000);

Metóda delegovania v aplikácii potom odosielala upozornenia na základe časovača dobíjania, ktorý jej bol odovzdaný.


Čo sme sa naučili

Vždy niečo chýba

Všetko sme si dokonale naplánovali. Vedeli sme, kedy bude spustenie. Všetko muselo ísť ako po masle. Pri záťaži sme nechali otestovať front-end a back-end. My ľudia sme už jednoducho nemohli urobiť žiadne chyby. Správny?


Štart prebehol naozaj hladko. Počas dopoludnia, keď sa popularita r/Place zvýšila, počet pripojení sa zvýšil a návštevnosť inštancií WebSocket sa zvýšila:




Predvídali sme to. A pripravovali sme sa na to, že v dôsledku toho sa sieť stane prekážkou v našom systéme. Ale ukázalo sa, že máme veľké zásoby. Pri pohľade na využitie procesora sme však videli veľmi odlišný obrázok:



Ide o osemjadrové stroje, takže bolo zrejmé, že dosiahli svoj limit. Prečo sa tieto „škatuľky“ zachovali tak nečakane? Rozhodli sme sa, že zaťaženie generované Place je svojou povahou veľmi odlišné od toho, čo bolo predtým. Okrem toho sa použilo veľké množstvo veľmi malých správ, zatiaľ čo zvyčajne posielame väčšie správy, ako sú aktualizácie živých vlákien a upozornenia. Zvyčajne tiež nemáme toľko používateľov, ktorí by dostávali rovnakú správu. Pracovné podmienky boli teda veľmi odlišné od bežných.


Rozhodli sme sa, že sa nič strašné nedeje: zväčšujeme sa a je to. Zodpovedný pracovník jednoducho zdvojnásobil počet inštancií a bez gramu vzrušenia išiel k lekárovi.


A potom sa stalo toto:



Na prvý pohľad nič zvláštne. Nebyť toho, že to bola naša produkčná inštancia RabbitMQ, ktorá spracováva nielen správy websocket, ale všetko, na čom závisí reddit.com. A nebolo to dobré. Vôbec nie dobré.


Po mnohých vyšetrovaniach, ručnom žmýkaní a aktualizáciách inštancií sme zúžili zdroj problému na rozhranie správy. Vždy to vyzeralo akosi pomaly a rozhodli sme sa, že to pravidelne žiadal náš zberateľ Rabbit Diamond. Mysleli sme si, že dodatočná výmena údajov spojená so spustením nových inštancií websocket v kombinácii s množstvom správ prijatých v súvislosti s touto výmenou viedla k preťaženiu králika, ktorý sa snažil sledovať vykonávanie požiadaviek na Panel správcov. Tak sme to jednoducho vypli – a situácia sa zlepšila.


Ale neradi sme v tme a tak ďalej narýchlo pokazil provizórny monitorovací skript:


$ cat s****y_diamond.sh #!/bin/bash /usr/sbin/rabbitmqctl list_queues | /usr/bin/awk "$2~//(tlač "servers.foo.bar.rabbit.rabbitmq.queues." $1 ".messages " $2 " " systime())" | /bin/grep -v "amq.gen" | /bin/nc 10.1.2.3 2013

Ak vás zaujíma, prečo sme neustále upravovali časové limity umiestnenia pixelov, odpoveďou je, že sme sa snažili znížiť zaťaženie celého projektu. Z rovnakého dôvodu sa nejaký čas na doske dlhšie nezobrazovali niektoré pixely.


Bohužiaľ, napriek takýmto správam:



Tu spomenuté cooldown zmeny boli čisto technické dôvody. Aj keď po nich bolo zaujímavé sledovať r/miesto/nová pobočka:



Možno to bola súčasť motivácie používateľov.

Boti zostanú robotmi

V záverečnej fáze projektu sme sa stretli s ďalším nepokojom. Pravidelne máme problémy so správaním zákazníkov pri opakovaných pokusoch. Mnoho klientov narazí na chyby a jednoducho znova odošle požiadavky. A znova. A znova. To znamená, že keď sa na stránke objaví nejaký problém, vedie to k vlne opakovaných požiadaviek od zákazníkov, ktorí nevedia, čo je to úryvok.


Keď sme vypli službu Place, koncové body, ku ktorým pristupovalo veľa robotov, začali vracať iné ako 200. chyby. Tento kód nebol veľmi úspešný. Našťastie boli všetky tieto opakované hovory ľahko zablokované na úrovni Fastly.

Vytváranie niečoho viac

r/Place by nebolo také úspešné, keby nebolo dobre koordinovaných tímová práca. Radi by sme poďakovali u/gooeyblob, u/egonkasper, u/eggplanticarus, u/spladug, u/thephilthe, u/d3fect a všetkým ostatným, ktorí pomohli uskutočniť tento prvoaprílový experiment.



Podobné články