• ×

    • Frontend: weboví a mobilní klienti. Získanie stavu plnej penzie

    21.02.2019

    Na počesť aprílových bláznov otvoril Reddit stránku pre používateľov, aby sa vyjadrili, 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: mohli nakresliť iba jeden pixel jednej zo 16 farieb každých päť minút a veľkosti plátna boli tiež obmedzené. Na nakreslené môžu byť nakreslené ďalšie pixely (a potom môže prvý autor opäť nakresliť svoj vlastný pixel na pixel súpera), čo je dôvod, prečo sú autori obrázkov a priori v konflikte. 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 väčšie."

    V momente spustenia projektu všetci doslova zaútočili na plátno – každý pixel na ňom bol zaplnený. Najprv používatelia jednoducho napichali farby do voľných pixelov, ale potom sa začali vytvárať tímy a začali kresliť jeden z najjednoduchších možných nápadov, ktorý našiel rovnako 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 z prvoaprílového projektu rozrástlo na miesto, kde sa používatelia z celého sveta spájajú do skutočných komunít, aby svetu niečo ukázali a podporili ich tvorbu od skupín nájazdníkov, ktorí si chcú naozaj len nakresliť nejaký svoj vlastný kreslenie.

    Miesto počas prvých otváracích hodín

    „Miesto“ sa stalo online nástenkou, ale každá je starostlivo vytvorená. Napríklad, ak chcete nakresliť a chrániť pred squattermi logo Linuxu s rozmermi 48 x 68 pixelov, muselo by to urobiť 3 264 ľudí súčasne.

    Používatelia sa stretávajú, 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 rozdielne krajiny(a nielen): každý je zodpovedný za „svoje“ srdce, no všetci spolu ľudia nechtiac tvoria jeden tím.

    A iní píšu celé plátna textu, napríklad ako táto skupina fanúšikov “ Hviezdne vojny“, ktorý napísal a podporil 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 sa nahradili robotmi, 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 konkrétnej farby), niektorým sa podarilo obísť bezpečnostný mechanizmus a vytvoriť roboty, ktoré im obrázky kreslia.

    Sú však aj takí, ktorí stále vytvárajú špeciálne vlákna, snažiac sa povzbudiť rovnako zmýšľajúcich ľudí, ktorí pomôžu nakresliť a zanechať pre budúce generácie niečo ako... zvracanie Ricka Sancheza z karikatúry „Rick and Morty“. vážne? Si si istý, že to nie sú roboti?

    Po 72 hodinách práce bol projekt uzavretý. Správa zdrojov poďakovala všetkým za ich úč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 bolo vstávať každý deň s úsmevom. A predtým sa čitatelia Redditu medzi sebou podelili o príbehy o dievčatách. Nie sú to len anonymní ľudia, ktorí využívajú populárny zdroj: herec nedávno strávil niekoľko hodín odpovedaním na otázky používateľov o filme „Trainspotting“.

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

      "Doska" by mala mať veľkosť dlaždíc 1000x1000, aby vyzerala veľmi veľká.

      Všetci klienti by mali byť synchronizovaní a mali by 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 súbežných používateľov.

      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 ovplyvniť prevádzku ostatných častí a funkcií lokality (aj keď je na r/Place vysoká návštevnosť).

    • Flexibilná konfigurácia musí byť poskytnutá v prípade neočakávaných prekážok alebo porúch. To znamená, že musíte byť schopní prispôsobiť veľkosť dosky a povolenú frekvenciu kreslenia za behu, ak je množstvo údajov príliš veľké alebo frekvencia aktualizácie je príliš vysoká.

    Backend

    Implementačné riešenia

    Hlavným problémom pri vytváraní backendu bola synchronizácia zobrazenia stavu dosky pre všetkých klientov. Rozhodlo sa, že klienti budú počúvať udalosti umiestňovania dlaždíc v reálnom čase a okamžite sa budú pýtať na stav celej dosky. Mierne zastaraný úplný stav je prijateľný, ak ste sa prihlásili 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 sa musia objaviť na hracej ploche ihneď po ich prijatí.


    Aby táto schéma fungovala, musí byť žiadosť o úplný stav dosky dokončená čo najrýchlejšie. Najprv sme chceli uložiť celú dosku do jedného radu v Cassandre a nechať každú požiadavku jednoducho prečítať tento riadok. Formát každého stĺpca 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 bolo 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 detaily však stále musia byť uložené v Cassandre, aby používatelia mohli zistiť, kto a kedy umiestnil 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.


    Takto sme uložili farby v Redis pomocou príkladu dosky 2x2:



    Obávali sme sa, že by sme mohli naraziť na priepustnosť čítania v Redis. Ak by sa pripojilo alebo aktualizovalo veľa klientov súčasne, všetci by súčasne posielali požiadavky na úplný stav dosky. Keďže doska predstavovala zdieľaný globálny stav, samozrejmým riešením bolo použitie vyrovnávacej pamäte. Rozhodli sme sa ukladať do vyrovnávacej pamäte na úrovni CDN (Fastly), pretože to bolo jednoduchšie na implementáciu a vyrovnávacia pamäť bola získaná najbližšie ku klientom, čo skrátilo čas na prijatie odpovede.


    Požiadavky na stav plnej penzie uložil Fastly do vyrovnávacej pamäte s časovým limitom jednej sekundy. Zabrániť veľké množstvožiadostí, keď vypršal časový limit, použili sme hlavičku stale-while-revalidate. Rýchlo podporuje približne 33 POP, ktoré sa navzájom nezávisle vyrovnávajú, 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žívali na napájanie Reddit.Live s viac ako 100 000 súbežnými používateľmi pre ž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 stavu plnej penzie


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




    Všimnite si, že rýchlosť žiadostí nikdy nedosiahla 33 za sekundu, čo znamená, že ukladanie do vyrovnávacej pamäte s Fastly bolo veľmi účinnými prostriedkami Ochrana aplikácie Reddit pred väčšinou žiadostí.



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

    Kreslenie dlaždice


    Fázy kreslenia dlaždice:

    1. Časová pečiatka posledného umiestnenia dlaždice 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, kedy bola dlaždica umiestnená používateľom.
    4. Služba websocket odošle správu o novej dlaždici všetkým pripojeným klientom.

    Aby sa zachovala prísna konzistencia, všetky zápisy a čítania v Cassandre sa vykonávali pomocou vrstvy konzistencie QUORUM.


    V skutočnosti sme tu mali preteky, kde používatelia mohli umiestniť viacero dlaždíc naraz. Vo fázach 1–3 nedošlo k žiadnemu blokovaniu, takže súčasné pokusy o ťahanie dlaždíc mohli prejsť kontrolou v prvej fáze a mohli byť ťahané v druhej fáze. Zdá sa, že niektorí používatelia objavili túto chybu (alebo použili roboty, ktoré ignorovali limit frekvencie žiadostí) – a v dôsledku toho bolo pomocou nej umiestnených asi 15 000 dlaždíc (~0,09 % z celkového počtu).


    Sadzby žiadostí a časy odozvy merané aplikáciou Reddit:



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


    Získanie podrobností pre konkrétnu dlaždicu


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


    Sadzby žiadostí a časy odozvy merané aplikáciou Reddit:



    Táto žiadosť sa ukázala byť 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 zostal na rovnakej úrovni počas celého trvania projektu.

    Websockety

    Nemáme jednotlivé metriky ukazujúce, ako r/Place ovplyvnilo službu websocket. Hodnoty však môžeme odhadnúť porovnaním údajov pred začiatkom projektu a po jeho ukonč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 asi 80 000 súbežných používateľov pripojených k r/Place.


    Priepustnosť služby Websocket:



    Na vrchole zaťaženia na r/Place preniesla služba websocket viac ako 4 Gbps (150 Mbps na inštanciu, celkovo 24 inštancií).

    Frontend: weboví a mobilní klienti

    V procese vytvárania frontendu pre Place sme museli vyriešiť mnoho zložitých problémov 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 API Canvas bolo preň ideálne. Použili sme prvok 1 000 x 1 000 a každá dlaždica bola nakreslená ako jeden pixel.

    Kreslenie plátna

    Plátno muselo odrážať stav dosky v reálnom čase. Po načítaní stránky bolo potrebné nakresliť celú nástenku a dokončiť kreslenie aktualizácií, ktoré prichádzajú cez websockety. Prvok plátna, ktorý používa rozhranie CanvasRenderingContext2D, možno aktualizovať tromi spôsobmi:

    1. Nakreslite existujúci obrázok na plátno pomocou funkcie drawImage() .
    2. Nakreslite tvary pomocou rôzne metódy kresliace formy. 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 vo forme hotového obrazu. Zostali teda možnosti 2 a 3. Najjednoduchším spôsobom bolo aktualizovať jednotlivé dlaždice pomocou fillRect() : keď aktualizácia príde cez websocket, jednoducho nakreslíme obdĺžnik 1x1 na pozíciu (x, y). Vo všeobecnosti metóda fungovala, ale nebola príliš vhodná na vykresľovanie 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 definovanie stavu dosky ako Uint8ClampedArray , kde každá hodnota je osembitové číslo bez znamienka v rozsahu 0 až 255. Každá hodnota predstavuje farebný kanál (červený, zelený, modrý, alfa) a pixel vyžaduje štyri prvky v poli. Plátno 2x2 vyžaduje 16-bajtové pole, v ktorom prvé štyri bajty predstavujú ľavý horný pixel plátna a posledné štyri predstavujú pixel vpravo dole.


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



    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 od 0 do 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. Preneste binárne dáta z nášho API klientovi.
    2. Rozbaľte dáta.
    3. Preveďte štvorbitové farby 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ú, sme použili 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, vám umožňuje pracovať s binárnymi údajmi vo forme jednobajtových jednotiek. Na klientskych zariadeniach sa ale ťažko používajú, preto sme dáta rozbalili, aby sa s nimi ľahšie pracovalo. Proces je jednoduchý: iterovali sme zbalené dáta, vytiahli bity vyššieho a nižšieho rádu a potom ich skopírovali do jednotlivých bajtov do iného poľa.


    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ť ďalšiu dekompresiu, rozdeliť každú farbu na bajty komponentného kanála a umiestniť ich do správneho indexu. Nie je veľmi vhodné vykonávať štyri zápisy na pixel. Ale našťastie tu 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 nahrávania štyri hodnoty v osembitovom poli môžeme zapísať jednu hodnotu do 32-bitového! Použitím Uint32Array na písanie sme boli schopní jednoducho aktualizovať farby dlaždíc jednoduchou aktualizáciou jedného indexu poľa. Museli sme však uložiť našu farebnú paletu v poradí veľkých bajtov (ABGR), aby sa bajty automaticky dostali na správne miesta pri čítaní pomocou Uint8ClampedArray .


    Spracovanie aktualizácií prijatých cez websocket

    Metóda drawRect() bola dobrá na vykresľovanie aktualizácií jednotlivých pixelov tak, ako boli prijaté, ale mala jednu slabinu: veľké dávky aktualizácií prichádzajúce naraz by mohli viesť k spomaleniu prehliadačov. A pochopili sme, že aktualizácie stavu dosky môžu prichádzať veľmi často, takže problém bolo potrebné nejako vyriešiť.


    Namiesto okamžitého prekresľovania plátna pri každom prijatí aktualizácie cez websocket sme sa rozhodli urobiť to tak, aby aktualizácie websocket, ktoré prichádzajú v rovnakom čase, mohli byť dávkované a vykresľované 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.

    Presunutím vykresľovania 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 webovej zásuvky prichádzajúce medzi snímkami (približne 16 ms) boli dávkované a vykreslené súčasne. 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.


    Urobiť 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. Potrebovali sme teda (veľký!) zoom. Používatelia navyše potrebovali mať možnosť jednoducho sa pohybovať po plátne, pretože bolo príliš veľké pre väčšinu obrazoviek (najmä pri použití zoomu).

    Zoom

    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ť zoom takého faktora, aby bola dlaždica dostatočne veľká a dala sa do nej ľahko umiestniť 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ú bola aplikovaná CSS transform: scale(40, 40). Bolo to skvelé riešenie na umiestňovanie dlaždíc, ale sťažovalo to zobrazenie dosky (najmä na malých obrazovkách), takže sme to urobili dvojstupňovým priblížením: 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. Ukázalo sa však, že 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 žiadne nepríjemnosti, ale jednoducho ničí pixelovú grafiku a mení ju na mydlovú kašu. Dobrou správou je, že existuje vlastnosť CSS nazývaná vykresľovanie obrázkov, pomocou ktorej môžeme prehliadačom povedať, aby nepoužívali vyhladzovanie. Zlou správou je, že nie všetky prehliadače túto vlastnosť plne podporujú.


    Zoom rozostrenie:



    Pre takéto prehliadače sme museli nájsť iný spôsob škálovania. Vyššie som spomenul, že existujú tri spôsoby kreslenia na plátno. Prvý, drawImage(), podporuje kreslenie existujúceho obrázka alebo iného plátna. Podporuje tiež zmenu mierky obrazu počas vykresľovania (približovanie alebo odďaľovanie). A aj keď má zoomovanie rovnaké problémy s rozmazaním ako spomínaný CSS, dajú sa vyriešiť univerzálnejším spôsobom z hľadiska podpory prehliadača – zrušením začiarknutia príznaku CanvasRenderingContext2D.imageSmoothingEnabled.


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

    Pohyb na plátne

    Plátno je pekné veľký obrázok, najmä pri pohľade z blízka, takže sme sa potrebovali vedieť po ň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ý bola 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 priblíženia.


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

    • „Kliknutie a potiahnutie“ (kliknutie a potiahnutie alebo potiahnutie dotykom);
    • „Presunutie 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 kurzora myši vzhľadom na počiatočnú pozíciu a potom sme tento posun pridali k existujúcemu posunu plátna. Poloha kamery bola okamžite aktualizovaná, takže navigácia bola veľmi citlivá.

    "Kliknutím presuňte"

    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 „pohyb“, 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 plynulosti. Namiesto okamžitého nastavenia novej pozície sme ju uložili ako „cieľ“. V rámci animačného cyklu (rovnakého, ktorý bol použitý na prekreslenie plátna) bola aktuálna poloha „kamery“ posunutá bližšie k cieľovej polohe pomocou funkcie vyhladzovania. To umožnilo zbaviť sa účinku príliš náhleho pohybu.

    Navigácia pomocou klávesnice

    Po plátne sa môžete pohybovať pomocou šípok na klávesnici alebo WASD. Tieto klávesy ovládali vnútorný vektor pohybu. Ak nebolo stlačené žiadne tlačidlo, predvolený vektor mal 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 procesu 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ý, ovládanie tlačidiel bolo rýchlejšie a oveľa prirodzenejšie.


    Pohybový vektor bol potom normalizovaný, vynásobený rýchlosťou pohybu a aplikovaný na aktuálnu polohu „kamery“. Normalizácia sa použila na zabezpečenie toho, aby rýchlosť diagonálnych a ortogonálnych pohybov bola rovnaká. Nakoniec sme aplikovali funkciu hladkosti na zmeny v samotnom pohybovom vektore. Tým sa vyhladili zmeny smeru a rýchlosti, takže sa „kamera“ pohybovala oveľa viac hladšie.

    Podpora mobilnej aplikácie

    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, mobilných aplikácií použili sme OAuth: v tomto prípade musia aplikácie poskytnúť prihlásenému používateľovi WebView s prístupovým tokenom. Najbezpečnejším spôsobom, ako to implementovať, je vložiť autorizačné hlavičky 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 ste už len museli analyzovať autorizačné hlavičky 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šom sa to robí jednoduchým volaním JS:


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

    Metóda delegovania v aplikácii potom odoslala upozornenia na základe časovača ochladzovania, ktorý jej bol odovzdaný.


    Čo sme sa naučili

    Vždy ti niečo chýba

    Všetko sme si dokonale naplánovali. Vedeli sme, kedy bude spustenie. Všetko muselo ísť ako po masle. Nechali sme otestovať záťaž frontendu a backendu. My ľudia sme už jednoducho nemohli urobiť žiadne chyby. Správny?


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




    Videli sme to prichádzať. 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ásobu. Pri pohľade na zaťaženie procesora sme však videli úplne iný obrázok:



    Ide o osemjadrové stroje, takže bolo zrejmé, že dosiahli svoj limit. Prečo sa tieto „škatule“ správali tak neočakávane? Rozhodli sme sa, že zaťaženie generované Place bolo 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. Takže pracovné podmienky boli veľmi odlišné od bežných.


    Rozhodli sme sa, že sa nič zlé nedeje: zväčšili sme sa a tým to skončilo. Zodpovedný zamestnanec jednoducho zdvojnásobil počet prípadov a bez štipky 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 vo všeobecnosti všetko, od čoho závisí fungovanie reddit.com. A nebolo to dobré. Vôbec nie dobré.


    Po dlhom skúmaní, ručnom žmýkaní a aktualizáciách inštancií sme zúžili hľadanie zdroja problému na rozhranie správy. Vždy to vyzeralo akosi pomaly a rozhodli sme sa, že náš zberateľ Rabbit Diamond to pravidelne požaduje. Mysleli sme si, že dodatočná komunikácia 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 administrátora. Tak sme to jednoducho vypli – a situácia sa zlepšila.


    Ale neradi sme v tme, takže rýchla oprava vytvorili sme 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ď je taká, ž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 neobjavili niektoré pixely.


    Bohužiaľ, napriek nasledujúcim správam:



    Tu uvedené zmeny času opätovného načítania boli čisto technické dôvody. Aj keď po nich bolo zaujímavé sledovať r/miesto/nové vlákno:



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

    Boti zostanú robotmi

    V záverečnej fáze projektu sme narazili na ďalší problém. Pravidelne máme problémy so zlým správaním klientov z hľadiska opakovaných pokusov. Mnoho klientov, keď čelia chybám, jednoducho posielajú opakované požiadavky. A znova. A znova. Totiž, keď sa na stránke objaví nejaký problém, vedie to k záplave opakovaných požiadaviek klientov, ktorí nevedia, čo je to výdrž.


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

    Vytváranie niečoho viac

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

    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 administrácia 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ú spoločne maľovať toto plátno, ako sa im páči. Ale v dôsledku toho sa to vyvinulo do bitky o Miesto, ktoré sa niekedy zmenilo 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 jeho vzniku sa udialo nespočetné množstvo drám, nápadov, bojov, dokonca aj vojen. Ale vo všeobecnosti je história Miesta večnou drámou o troch silách, ktoré ľudstvo potrebuje na to, aby vytvorilo, vytvorilo a vyvinulo technológiu.

    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 dokážu. V prvých minútach sa objavili prvé skice. Drsné a nezrelé, podobali sa rockové umenie jaskynných ľudí.

    Tvorcovia hneď videli, akú silu a potenciál ukrý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 dostal skvelý nápad použiť na kreslenie mriežku, ktorá by sa prekryla na výkrese a ukázala, kde by sa mali nachádzať ďalšie pixely. Prvý, kto podstúpil tento experiment, bol slávny mém anglicky hovoriaceho internetu Dickbutt. A obyvatelia Place sa pustili do práce: Dickbutt sa zhmotnil doslova za pár minút v ľavom dolnom rohu plátna. Na stránke sa objavil prvý výtvor kolektívnej kreativity.

    Keď sa potom tvorcovia mierne opájali možnosťami, objavil sa Pokémon Charmander, ktorý mal čoskoro namiesto nohy penis. A začal sa prvý konflikt: niektorí tvorcovia sa usilovne snažili upratať útočné kresby, iní však vytrvalo pridávali obscénnosti.

    Tvorcovia stáli pred zásadným filozofický problém: Príliš veľa slobody vedie k chaosu. Kreativita potrebuje obmedzenie, rovnako ako potrebuje slobodu.

    obrancov

    Na Mieste sa objavil iný typ používateľa, ktorý sa musel popasovať práve s týmto problémom. Ale začali s primitívnejšími cieľmi: dobyť svet. Rozdelení do frakcií podľa farby sa snažili 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 Green Grid maľovala plátno cez pixely – zelené bunky preložené bielymi. Keďže museli maľovať len 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 cieľov bitky. Modrý roh začal načrtávať Pokémona modrými pixelmi a Tvorcovia prešli z „falických vojen“ (ktoré dokážu nakresliť najviac vtákov) na vážnejšiu hrozbu. Vzali sa do boja a namaľovali každý modrý pixel svojim vlastným. Kvantitatívna výhoda však nebola v ich prospech.

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

    Každá frakcia čelila tejto otázke. A všetci sa rozhodli uložiť ďalšie kresby. Vlny farieb teda začali prúdiť okolo kresieb bez toho, aby ich maľovali.

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

    Ale šťastný koniec to ešte nie je

    Nakoniec boli nenásytné vlny farieb zastavené a Tvorcovia sa mohli vrátiť ku kreativite. Výkresy boli čoraz zložitejšie. Objavili sa texty napísané v pixeloch.

    Tvorcovia sa zjednotili v malé skupiny, vytváranie subredditov na Reddite, kde by sa dalo diskutovať o návrhoch a stratégii. Jeden z najviac úspešné skupiny Nakreslil som panel úloh v štýle Windows 95. Ďalší načrtol Miesto so srdiečkami.

    Potom sa objavil Van Gogh.

    Ale také jednoduché to nebolo. Obrancovia sa zmenili na tyranov, ktorí diktovali štýl kresieb. Rozhodovali, čo sa dá nakresliť a čo nie. Frakcie si medzi sebou začali rozdeľovať používateľov, volali po stranách, zatiaľ čo Tvorcovia čakali na schválenie nových nápadov.

    Boje medzi obrancami boli čoraz ostrejšie. Jeden streamer Twitch vyzval svojich nasledovníkov, aby zaútočili na Blue. Boli vyvinuté bojové stratégie. Vyskytli sa dokonca aj provokácie: fanúšikovia rovnakej farby sami namaľovali pixely nepriateľskej farby na svoje územie, aby mali ospravedlnenie pre odvetný útok. Zatiaľ čo frakcie medzi sebou bojovali, Tvorcovia zistili, že nezostalo miesto na nové kresby.

    Začali sa objavovať vlajky rôznych krajín - ako rástli, nevyhnutne do seba narážali. Napríklad vlajky Nemecka a Francúzska sa zrazili v „krajine nikoho“.

    Zdalo sa, že tento malý svet je na pokraji vojny. Všetky strany sa snažili konflikt vyriešiť diplomaticky. Lídri Tvorcov a Ochrancov komunikovali v chatoch, no väčšinou to skončilo vzájomným obviňovaním.

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

    Torpédoborce

    Prišla prázdnota.

    Začalo to 4chan, najznámejším imageboardom na svete. Srandisti, ktorí ho obývali, si všimli, čo sa deje na Reddite a nemohli to ignorovať. 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 pomocou diplomacie. Ale zlyhali, Prázdnota konala inak. Nepatrila medzi ochrancov, neštítila sa umenia. Jej nasledovníci kázali, že Prázdnota zožerie všetko. Netvorili strany, chceli len natrieť celý svet na čierno.

    Presne toto bolo nakopnutie do zadku, ktoré Miesto potrebovalo. Tvorcovia a obrancovia sa tvárou v tvár spoločnej hrozbe opäť spojili, aby zachránili umenie. Účelom Prázdnoty však nebola len deštrukcia, nejako to dalo vzniknúť novému, lepšiemu umeniu.

    Napríklad pozícia v strede bola medzi tvorcami jedna z najkonkurovanejších. A keď sa to zmenilo na čierne, Defenders si uvedomili, že budú musieť prísť s lepším nápadom, ktorý by prilákal dostatok nasledovníkov na boj s čiernym monštrom. Jednou z týchto myšlienok bola vlajka USA.

    V posledný deň existencie Námestia sa v ňom vytvorila najúžasnejšia koalícia určená na boj proti Prázdnote - boli tu Trumpoví fanúšikovia a Trumpoví oponenti, republikáni a demokrati, Američania a Európania.

    Experiment Reddit sa čoskoro skončil. Na výslednom plátne nebola ani jedna rasistická kresba či jediný symbol nenávisti.

    Twitter

    Vreckové

    Linkedin

    fb messenger

    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. Mohli ste 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 môžete vytvoriť oveľa viac, ako len konať sami.

    To, čo sa stalo počas nasledujúcich 72 hodín, zanechalo organizátorov v šoku. 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ý státisícmi ľudí, ktorí nemali nič spoločné okrem internetového pripojenia. Tak či onak, 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 – bojov, bitiek a vojen, niekedy aj z neznámych príčin. 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 sa plátno ukázalo večný príbeh o troch silách, ktoré ľudstvo potrebuje na vytvorenie.

    Tvorcovia

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

    Tvorcovia začali prefarbovať pixely náhodne, len aby zistili, čo dokážu. Prvé kresby preto skôr pripomínali jaskynné maľby – umelci ešte len začínali rozťahovať krídla.

    Pomerne rýchlo si uvedomili, že pri samostatnej práci a umiestnení iba jedného pixelu každých 5-10 minút nebolo možné vytvoriť nič významné. Niekto im určite zničí prácu. Aby vytvorili niečo väčšie, musia spolupracovať.

    A potom niekto navrhol kreslenie na mriežku, ktorá by jasne ukázala, kde je potrebné namaľovať ďalší pixel, aby vznikol súvislý obrázok. Takto sa v ľavej dolnej časti plátna 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. Pokémon Charmander sa objavil vedľa Dickbutta a namiesto labky začal rásť penis a potom ďalšie dva.

    Už to nebol dizajn. Niektorí tvorcovia sa zúfalo snažili odstrániť provokatívne doplnky, volajúce po „čistom“ umení, iní však pokračovali vo svojom. Ale nebolo to tam.

    Ukázalo sa, že príliš veľa slobody vedie k chaosu. Kreativita potrebuje obmedzenia 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 veľmi rýchlo vyriešil iný typ užívateľov – správcovia. Prišli s jediným cieľom – dobyť celý svet.

    Po vytvorení frakcií podľa farby začali dobývať priestor a maľovať ho určitou farbou. Jednou z prvých a najväčších frakcií 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 pokryť celý priestor plátna. Pixel po pixeli začali svoju predstavu pretavovať do reality a čoskoro zachytili obrovské plochy.

    Blue Corner nebol vo svojich ašpiráciách 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) – začala všade presádzať zelené a biele pixely. Preukázala vysokú efektivitu, keďže potrebovala namaľovať o polovicu menej pixelov ako ostatné frakcie.

    Strážcovia spustili frontálny útok na tvorcov. Charmander sa stal prvým miestom bitky. Po zistení, že Blue Corner začal zapĺňať Pokémonov modrými pixelmi, si tvorcovia uvedomili hrozbu a zastavili medziľudské vojny.

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

    A nejako sa to otočilo. Modrý kútik začal debatu o ich úlohe v tvorivý proces. Jeden účastník sa opýtal: „Keďže naša vlna nevyhnutne úplne ovládne svet, mali by sme prejaviť milosrdenstvo aj iným formám umenia, s ktorými sa stretávame?

    To bola otázka, ktorá skôr či neskôr vyvstala pred každou frakciou. Pri všetkej expanzívnej horlivosti, čo mali robiť s umením, ktoré im stálo v ceste?

    Stalo sa bod otáčania. Bezduché frakcie sa stali ochrancami.

    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 sme 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 sŕdc ako v starých videohrách ako Zelda. S týmto projektom sa pustilo len pár ľudí, no ďalší sa k nim rýchlo pridali a nakoniec sa srdiečka namaľované vo farbách rôznych vlajok natiahli cez polovicu plátna.

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

    Nie všetko však išlo hladko. Z obhajcov, ktorí kedysi oslavovali tvorbu umeleckých diel, sa stali tyrani diktujúci módu. Začali naznačovať, čo sa dá vytvoriť a čo nie. Začalo to krátko predtým, ako tvorcovia začali tvoriť podľa vlastných pravidiel.

    Frakcie obrátili svoj pohľad na seba 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 súhlas s myšlienkami nového umenia.

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

    Vyskytli sa dokonca falošné útoky, pri ktorých nasledovníci rovnakej farby umiestnili pixely súperov 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 krajín. 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 bol svet, ktorý na začiatku unikol primitívnym nájazdom, pripravený na totálnu vojnu. Zúfalé pokusy vyriešiť problém diplomaticky nikam neviedli. Stretávajú sa na chatoch, vodcovia tvorcov a obrancov sa navzájom obviňujú.

    Potrebná bola lasička, s ktorou by sa každý mohol dohodnúť.

    Torpédoborce

    Na dianie na Reddite upozornila internetová stránka 4chan. A nemohli prejsť okolo. Ich užívatelia si vybrali farbu ich srdcu najbližšiu – čiernu. Stali sa Prázdnotou.

    Práve keď sa slza pomaly šíri po povrchu, v strede plátna sa 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 ochrancom. Na rozdiel od ostatných frakcií nepreukázala žiadnu lojalitu k umeniu. Stúpenci Prázdnoty vyznávali 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. Všetci účastníci projektu, ktorí sa ocitli na pokraji vyhynutia, sa zjednotili v boji proti Prázdnote, aby si zachovali svoje umenie.

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

    Prázdnota sa teda stala katalyzátorom stvorenia najväčšie dielo umenie.

    O centrálnu časť plátna sa od začiatku viedol tvrdohlavý boj. Tvorcovia si toto územie nárokovali pre svoje diela. Najprv sa o to pokúšali pomocou ikon. Potom v koordinovanom pokuse vytvoriť hranol, ako je ten na obale albumu Pink Floyd « zadná strana Mesiac."

    Ale Prázdnota zjedla všetko. Jeden výtvor za druhým len živil jej pažravú chuť na chaos.

    A predsa to bolo presne to, čo bolo potrebné. Po zničení umenia Void 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 táto myšlienka sa stala americkou vlajkou.

    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 v inej situácii navzájom roztrhli – od podporovateľov a odporcov Trumpa, od demokratov a republikánov, od Američanov a Európanov.

    Zišli sa, aby spolu vytvorili niečo v tomto malom kúte internetu, čím dokázali, že vo veku, keď sa takáto spolupráca zdá 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 na desiatkach chatov. 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 absencii zákazov na konečnom plátne neboli žiadne rasistické alebo mizantropické symboly. Bol to krásny kolobeh 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 tvrdili, že nebesia sa skladajú z troch súperiacich, no nevyhnutných božstiev: Brahma Stvoriteľ, Višnu Zachovateľ a Šiva, torpédoborec.

    Ani bez jedného z nich by Vesmír nemohol fungovať. Aby bolo svetlo, je potrebná tma. Aby život mohol existovať, smrť je nevyhnutná. 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 vyžaduje všetky tri komponenty.

    Finálne maľovanie



    Podobné články
     
    Kategórie
    Video materiály
    Populárne
    Nový