Flex a Silverlight - porovnanie konkurenčných technológií

Publikoval Michal Kočí dňa 5.6.2009 o 00:24 v kategórii Silverlight

Flex, ako konkurenčná platforma Silverlightu je veľmi zaujímavá a ja som sa už dávnejšie rozhodol, že sa pozriem na to, čo zvládne. Tak som sa niekoľko posledných dní venoval štúdiu Flexu a v tomto príspevku by som chcel poukázať na to, čo sa mi na tejto technológií páči a porovnať ju trochu so Silverlightom.

Silverlight poznám docela dobre - mám za sebou jeden projekt v ešte rannej verzii Silverlightu (vtedy ešte WPF/E), jeden väčší projekt v Silverlight 2.0, ktorý práve dokončujeme a niekoľko menších nasadených v ostrej prevádzke. S Flexom toľko skúseností zďaleka nemám, ale cieľom tohto príspevku aj tak nie je hĺbkovo zanalyzovať rozdiel medzi nimi - skôr poukázať na to, čo ma na ktorej technológii zaujalo a či a prípadne ako funguje ekvivalent v technológii druhej.

Moje úvahy som začlenil do nasledovných oddielov:

Vývojové prostredie

Flex 3 aplikácie sa programujú v prostredí Flex Builder 3, čo je nadstavba nad open source Eclipse. Je to veľmi pohodlné vývojové prostredie a i keď sa nie vo všetkom vyrovná Visual Studiu, je treba priznať, že na vývoj je príjemné - je intuitívne a ľahko sa používa. Jeho drobným negatívom je, že nie je zdarma - aktuálne stojí 217,48 EUR. Nijaké bezplatné vývojové prostredie pre Flex som nenašiel, na druhej strane som ani extrémne dlho nehľadal. Kompilátor je síce zdarma, takže teoreticky môžete vyvíjať aj v obyčajnom textovom editore, ale pre trochu väčšie riešenie to asi nebude to pravé orechové.

Flex Builder - Visual Designer

Flex Builder 3

Pre vývoj Silverlight aplikácií sa používa Visual Studio - toto je veľmi pokročilý editor, ktorý existuje v niekoľkých edíciach. Edícia Express je zdarma a Silverlight aplikácie sa v nej vyvíjať dajú. Toto je určite bod pre Silverlight. Druhým dychom treba však dodať, že súčasná verzia Visual Studia neobsahuje vizuálny editor pre Silverlight, takže programovať a kompilovať v ňom môžete, takisto aj robiť robiť vizuálnu stránku aplikácie, ale iba bez editora - zápisom priamo XAML kódu. Čiže mínusový bod, ktorý vlastne zmaže pre chvílou pridelený plusový bod.

Visual Studio - XAML

Visual Studio - C Sharp

Ak chcete vizuálny editor, potom Microsoft ponúka Expression Blend. Tento však už zadarmo nie je a momentálne stojí 611,80 EUR. Tiež treba povedať, že tento nástroj je skôr určený grafikom a aj jeho prostredie nemusí byť pre každého programátora hneď intuitívne. Tu by som len upozornil, že toto prostredie ešte nie je úplne odladené - my sme s ním mali docela veľké problémy, kedy nám prestalo zobrazovať dizaj niektorých komponentov a neexistoval na to ani workaround.

Expression Blend

Moje dojmy sú také, že Visual Studio je super, dobre sa v ňom robí, ale absencia vizuálneho návrhu grafického rozhrania je docela mínus. Na druhej strane sa dá dobre vyvýjať aj bez neho, najmä pokiaľ už dizajn máte predpripravený. Komu by tento chýbal, vždy môže siahnuť po Blende. Flex Builder je tiež dobré prostredie, v ktorom sa tiež dobre vyvíja a navyše podporuje aj grafický návrh. Preto vývoj či už Flex aplikácií alebo Silverlight aplikácií je rozhodne uľahčený kvalitnými IDE na oboch stranách.

Čo mne chýba vo Flex Builderi asi najviac je poriadny intellisense (automatické doplňovanie kódu). Flex Builder síce tiež intellisense má, ale nezobrazuje pre jednotlivé položky tejto ponuky žiaden popis, pre metódy a vlastnosti žiadnu nápovedu:

Flex Builder IntelliSense

Flex Builder IntelliSense

Visual Studio má rozhodne ďaleko prepracovanejší IntelliSense:

Visual Studio IntelliSense

Visual Studio IntelliSense

Visual Studio IntelliSense

Penetrácia a podpora OS

Vyvinúť aplikáciu je jedna vec, sprístupniť ju užívateľom je vec druhá. Pokiaľ vyvíjate riešenie, kedy sa predpokladá, že koncový používateľ si jednoducho inštaláciu stiahne, pokiaľ technológiu nainštalovanú nemá, alebo mu bude nainštalovaná inak (obvykle v rámci firmy cez doménové politiky), potom Vás penetrácia trápiť nemusí. Obvykle ju netreba riešiť, pokiaľ vyvíjate riešenie pre intranet, i keď ani toto nemusí byť úplná pravda. Ak však z akéhokoľvek dôvodu je pre Vás penetrácia dôležitá, potom si dajte na Silverlight pozor.

Flex ťaží z toho, že jeho runtimom na webe je Flash - no a penetrácia Flashu je naprosto úžasná - podľa štatistík Adobe je vyššia ako 98%. U Silverlightu ako u technológie relatívne mladej je situácia o dosť horšia. Oficiálna štatistika Microsoftu pravdepodobne neexistuje a tak je potrebné sa spoľahnúť na iné zdroje, napríklad na Rich Internet Application Statistics alebo Rich Internet Application Market Share. Podľa oboch je penetrácia Silverlightu približne na úrovni 27%, pričom penetrácia je samozrejme v rôznych regiónoch rôzna (napríklad v UK väčšia ako 40%, kým na Slovensku necelých 20%).

S penetráciou úzko súvisí aj podpora operačných systémov. Kým Flash beží snáď všade, Silverlight momentálne beží len na operačných systémoch Windows s MacOS, pričom ani množina podporovaných prehliadačov nie je najväčšia - podporované sú však aspoň tie najväčšie a samozrejme to, že niektorý nie je oficiálne podporovaný ešte neznamená, že na ňom Silverlight nebeží. K projektu Silverlight je vyvíjané dvojča, Moonlight, čo je portácia tohto prostredia pre Linuxy. Jeho vývoj je vždy trochu pozadu za Silverlightom, ale aspoň takýto vývoj existuje.

Čo sa mňa týka, napriek tomu, že som veľkým fanúšikom Silverlightu, tak ma mrzí jeho nízka penetrácia a teším sa na moment, kedy bude táto obdobná ako u Flashu (teda aj Flexu). Vysoká penetrácia Flashu bola jedným z hlavných dôvodov, prečo som sa na štúdium Flexu dal.

Beh na webe vs. beh na desktope

To, že aplikácie vytvorené v technológii Flex ako aj Silverlight bežia vo webovom prehliadači je pravdepodobne jasné. Pokiaľ chcete desktopovú alternatívu pre Silverlight, máte k dispozícii technológiu WPF, ktorá by mala byť nadmnožinou Silverlightu. Teoreticky by to malo ísť, osobne si myslím, že to až také bezbolestné nebude. Navyše, WPF je súčasťou .Net Frameworku 3.5, ktorý je momentálne iba pre Windows. A aby toho nebolo málo, inštalácia .Net Frameworku nie je zrovna malá - plný inštalačný balík má 230 mega.

Vytiahnuť aplikáciu z prehliadača by malo ísť v Silverlight 3, avšak táto naďalej ostane bežať v kontexte prehliadača, čiže naďalej v sandbox mód - s riadne okresanými právami. Z pohľadu bezpečnosti je to určite skvelá správa, z pohľadu pridanej hodnoty nie až tak dobrá - runtime AIR, ktorý slúži pre beh Flex aplikácií na desktope dáva aplikácii väčšie práva a inštalačný balík má iba 15 mega. Navyše kód vyvynutý pre web je kompatibilný s desktopovým a netreba ho teda prekompilovávať. Drobné zmeny v aplikácii spraviť treba, ale používané knižnice kódu je možné zdielať.

Mne sa osobne viac páči prístup, kde runtime AIR dáva väčšie práva a riešenie, ktoré prináša Silverlight 3 je podľa mňa z funkčného hľadiska nie moc šťastné. Uvidíme, či to tak bude fungovať aj vo finálnej verzii a ak áno, či nebude Microsoft v niektorej z ďaľších verzií zákazníkmi viac pritlačený k väčším právam. Osobne tipujem (a pevne dúfam), že bude.

Veľkosť aplikácie

Toto je jedna z vecí, ktorá sa mi na Flexe až tak nepáči - veľkosť aplikácie je obrovská už na začiatku, keď je Vaša flex aplikácia prázdna, neobsahuje nič, dokonca ani len obyčajné tlačítko. Spravíte takúto prádzu aplikáciu a jej veľkosť je cca 280 kilo. V poriadku, jedná sa o debug verziu, takže z nej spravíte release verziu a hneď ste na 170 kilách. Dobre, ale stále veľa. Tak sa rozhodnete, že flex framework sa nemá skompilovať do Vašej aplikácie, ale má byť samostatne stiahnuteľný - aplikácia sa dostala na 65 kilo, ovšem framework ktorý ste vyčlenili von má 560 kilo.

Ako je na tom Silverlight? Oveľa, oveľa, oveľa lepšie. Oveľa. Silverlightová aplikácia je vlastne zip súbor, čo má na veľkosť súboru samozrejme tiež vplyv. Avšak, prázdna aplikácie obsahuje iba jednu knižnicu kódu a to tú, ktorá reprezentuje Vašu aplikáciu. A tak má prázdna Silverlight apliklácia 4 kilá! A to aj v debug, aj release verzii. To je obrovský rozdiel a aj obrovské plus pre Silverlight.

Ako sa veľkosť zmení, keď sa pridá tlačítko a popisok na formulár? U oboch sa veľkosť zmení minimálne. Silverlight aplikácia sa začne zväčšovať až v momente, kedy alebo napíšete veľké množstvo kódu (či už kódu alebo markupu), alebo keď začnete používať knižnice kódu, ktoré sú potom pribalené do aplikačného súboru (nemusia byť, ale defaultne sú). Silverlight je na tom teda lepšie, najmä vďaka zozipovaniu súboru - v tomto ja vidím silnú výhodu Silverlightu. Flexová knižnica kódu, SWC súbor, je tiež zip, avšak v ňom je uložený zase SWF súbor, ktorý už s minimálnou funkcionalitou obrovský - čiže jeho zozipovanie rozhodne znamená istú usporu, ale voči DLL súborom, ktorých veľkosť ozaj začína na 4 kilách sa to jednoducho nechytá.

Štruktúra aplikácie, používané jazyky

Štruktúra aplikácie je u oboch technológií veľmi podobná - grafický výzor je definovaný deklaratívne v jazykoch postavených na XML - U Silverlightu je to XAML, u Flexu MXML. Čo sa týka samotného programového kódu, tak kým u Flex aplikácií je to ActionScript, u Silverlightu to môže byť C# alebo aj Visual Basic.Net.

Jedna z výhod Silverlightu je v tom, že pokiaľ ste .Net programátor a programujete v jednom z uvedených jazykov, nemusíte sa učiť nový programovací jazyk. Ďaľšia je, že Silverlight so sebou prinesie na klientský počítač akýsi micro framework, čiže podmnožinu veľkého frameworku a tak aj väčšinu tried už programátor pozná z plného .Net frameworku. Navyše, tento framework ktorý beží v rámci prehliadača funguje obdobne ako plný, čiže tiež poskytuje behové prostredie (CLR), správu pamäte vrátane Garbage Collectora, ...

U Flexu používaný jazyk Action Script je jazyk skriptovací, založený na ECMA skripte, na ktorom je založený aj JavaScript. Ten je časťou vývojárov zatracovaný, časť si ho nevie vynachváliť. Za seba môžem povedať, že programovanie v Action Scripte nie je nič zložité, ba práve naopak je to podobné a podobne pohodlné ako napríklad v jazyku C#. Navyše Action Script prináša isté výhody (čo niekto môže považovať aj za nevýhodu) v podobe dynamických čŕt jazyka a tak napríklad programovanie voči webovým službám nevyžaduje mať predgenerované proxy triedy zabezpečujúce silnú typovosť (i keď aj tie je možné si nechať vygenerovať). Samotný jazyk je naozaj natoľko podobný JavaScriptu, Jave či C#, že s ním väčšina programátorov nemôže mať problém.

Pri programovaní Silverlight aplikácie je teda dizajn deklarovaný v XAML súbore, vo fyzicky inom súbore je k tomuto pripojený programový kód vo zvolenom programovacom jazyku - teda dizajn je od kódu oddelený (toto sa nazýva code behind) a kód sa v XAML ani nemôže nachádzať. U Flexu je možné mať kód priamo v MXML, slúži na to element Script. Väčšina príkladov to tak aj robí, kód dáva priamo do MXML. Pre nás, ktorým tento prístup nevyhovuje, je vo Flexe spôsob, ako fungovať rovnako ako u Silverlightu a tak kód môžeme od markupu oddeliť.

Sada komponent, štýlovanie a skinovanie

Obe technológie obsahujú predpripravenú sadu komponent, ktoré sa dajú použiť pri tvorbe aplikácie. Táto množina je vo Flexe naozaj veľmi široká a bohatá, čo sa o komponentách v Silverlighte povedať moc nedá. Tie Flexové sa najlepšie dajú pozrieť v AIR aplikácii Tour de Flex. Silverlight ich má menej, pričom niektoré sú aj v ostrej verzii bugové a ich použitie je niekedy nočnou morou - jedná sa najmä o tie komponenty, ktoré používajú Popup (ComboBox, ToolTip). Silverlightu v tomto ohľade nepomáha ani absencia vizuálneho návrhu vo Visual Studiu. Jednoducho, v tomto má Silverlight určite množstvo priestoru na zlepšovanie.

Čo je milé na Silverlighte, že jednoduchým spôsobom umožňuje štýlovanie (tvorba štýlov za účelom jednotného výzoru komponent) a skinovanie (možnosť absolútnej zmeny výzoru komponent). Štýlovanie aj skinovanie sa vykonáva prostredníctvom referencovania štýlov, ktoré sa ukladajú do tzv. resource na úrovni ovládacieho prvku alebo na úrovni jeho ľubovoľného rodiča - tieto pomenované štýly sa potom referencujú z prvkov, ktoré tento štýl alebo skin majú na seba aplikovať. Problém nastane, keď chcete aby sa štýl alebo nový skin aplikoval na všetky inštancie daného prvku - napríklad na všetky tlačítka. To v súčasnej verzii natívne nejde, existujú nejaké workaroundy, ale to je len obchádzanie problémov. Toto je vyčítané Silverlightu a snáď to bude v ďaľšej verzii odstránené - pre zaujímavosť WPF toto zvládne.

Flex dokáže aj štýlovať aj skinovať. Na štýlovanie sa používa CSS, čiže je to formát, ktorý je veľmi dobre známy. Navyše, narozdiel od Silverlightu, je možné štýly aplikovať aj globálne, na všetky inštancie toho ktorého komponentu či ovládacieho prvku. V tomto mi je teda sympatickejší Flex.

Čo sa inde nezmestilo

Ešte pred tým, ako sem umiestnim zopár relevantných linkov, tak mám ešte zopár vecí, ktoré sa mi rozhodne páčia na tej ktorej technológii, ale nevydali by na samostatný odsek v tomto článku, neboli v článku uvedené a nezabudol som na ne...

Takže, na Flexe sa mi páčí:

  • Možnosť ukotvovať prvky voči svojmu rodičovi
  • Pri včlenení fontu do aplikácie možnosť včleniť iba niektoré znaky
  • Automatická podpora scrollovania scrollovacím kolečkom myši - čo u Silverlightu treba riešiť workaroundmi (ktoré napríklad nefungujú vo fullscreene)
  • Možnosť pridávať položky do kontextového menu

Na Silverlighte sa mi páči:

  • Šikovné layout prvky (najmä Grid)
  • Možnosť použiť jazyk, ktorý poznám a jedno vývojové prostredie pre vývoj klientskej aj serverovej časti

Ak máte pocit, že viac negatív som vymenoval u Silverlightu, máte pravdepodobne pravdu - osobne to však pripisujem tomu, že posledných pár mesiacov robím na projekte práve v tejto technológii a použili sme snáď jej každú črtu - preto poznám jej negatíva rovnako ako aj pozitíva - u Flexu mi chýba praktická skúsenosť. Verím, že aj ten má veľa negatív, na ktoré som však za tých pár dní nenarazil - a hlavne som sa pri jeho učení snažil sústrediť na pozitíva.

Môje rozhodnutie použitia tej ktorej technológie je nasledovné - pre intranetové aplikácie rozhodne Silverlight, napriek drobným problémom (ktoré už som sa naučil riešiť) mám jedno vývojové prostredie, v ktorom spravím celú aplikáciu - od databázovej vrstvy, cez serverovú až po klientskú. Penetrácia v intranetovom prostredí nevadí, pretože je možné Silverlight nainštalovať napríklad cez doménovú politiku. Do internetu, pokiaľ mám cieľovú skupinu, u ktorej viem, že môžem risknúť malú penetráciu a že si užívatelia Silverlight nainštalujú a nebudú mi z webu kvôli tomu odchádzať, tak rozhodne opäť Silverlight (napríklad administrácia webu alebo jej časť môže byť v Silverlighte). Ak mi nízka penetrácia vadí a mám pocit, že by mohla ovplyvniť môj biznis, potom rozhodne Flex.

Za tých pár dní, ktoré som s Flexom strávil môžem rozhodne prehlásiť, že sa jedná o slušnú a vyspelú technológiu. A som rád, že sú na poli RIA aplikácií dvaja silný hráči, pretože konkurencia oboch tlačí k tomu, aby svoje riešenie odlíšili a zlepšili, a to mne ako zákazníkovi úplne vyhovuje.

Ak ste dočítali až sem tak gratulujem a na záver pridám tri linky od českých programátorov, ktoré sú relevantné k danej problematike:

Mohlo by ťa tiež zaujímať

Páčil sa ti príspevok?

Zdieľaj príspevok alebo si ho odlož na neskôr

Sleduj ma

Ak nechceš premeškať príspevky ako je tento, sleduj ma na Twitteri, alebo ak máš RSS čítačku, môžeš sledovať môj RSS kanál.

Kategórie

Archív

Školenia a kurzy

Audioknihy

Podcasty