pátek 26. května 2017

Co je nového v Ionic 3

Jak jsme si ukázali minule, Ionic je oblíbený framework na tvorbu hybridních mobilních aplikací. Nyní je již k dipozici Ionic ve verzi 3. Co přinesl nového?

Změny pod kapotou

  • Změny ve verzi 3 nejsou nijak dramatické. Po vzoru Angularu se ruší číslování verzí a framework bude označován jen jako “Ionic”.
  • Framework by měl mít rychlejší start a celkově být stabilnější. Jeho celková velikost se také změnšila.
  • Stěžejní a pro nás nejvýraznější změnou je podpora Angularu 4.
Při přechodu z verze 1 na verzi 2 u příkazu ionic start pro vytvoření nového projektu přibyl argument --v2, který definoval vytvoření projektu ve verzi 2. Pokud chceme vytvořit projekt verze 3, pak stačí zadat jen ionic start s tím, že se nainstaluje ta nejnovější dostupná verze (platí od Ionic CLI v2.2.3, ve staších verzích CLI musíte pro nejnovější verzi Ionicu zadat argument --v2).
 

Dekorátor IonicPage

Ionic nepoužívá Router, namísto něj má tzv. deep link system, kdy se o přechod mezi Pages stará NavController, který má metody Push a Pop.
Do funkce Push se vkládá název komponenty, na kterou chceme přesměrovat, například:
this.navCtrl.push('MyPage');

Pokud bychom si komponentu chtěli označit jinak, můžeme využít parametru name v dekorátoru IonicPage, díky kterému pak linkujeme na komponentu díky vlastní proměnné: 
@IonicPage({
 name: 'my-page'
})
@Component({
 ...
})
export class MyPage {...}

Následně na tuto komponentu můžeme linkovat přes proměnnou nastavenou v dekorátoru:
this.navCtrl.push('MyPage');

Další vlastností dekorátoru IonicPage je atribut segment, který definuje URL parametr pro danou komponentu v případě, že je zrovna aktivní:
@IonicPage({
 name: 'my-page',
 segment: 'some-path'
})

V URL se daná komponenta zobazí následovně:
http://localhost:8101/#/some-path

Do proměnné segment se dá vložit i dynamická proměnná, a to ve formátu :variable, příklad:
@IonicPage({
 name: 'detail-page',
 segment: 'detail/:id'
})

Samotná proměnná se předává v metodě Push, odkazující na naší komponentu.
Více o IonicPage dekorátoru se můžete dozvědět v oficiální dokumentaci.

Lazy loading

Jednou z features nového Ionicu je i možnost nastavit si lazy loading, který znatelně zrychlí celou aplikaci. Lazy loading však není plně odladěn a stále má nedostatky. Autoři Ionicu se na svém blogu dokonce zmiňují, že hledají testery a ocenili by pomoc komunity při testování lazy loadingu.

Vhozená rukavice

Nic není perfektní a nová verze Ionicu není vyjímkou. Mezi nedostatky, které si zaslouží péči patří:
  • Chybné updatování URL adres při pushnutí se do komponenty nejvyšší úrovně, která využívá nav-tabs.
  • Deep linking funguje zatím jen v jednom navigačním zásobníku, což znamená že při použití rozdělených panelů (tzv. Ionic split pane) nebude URL navigace fungovat správně.

Co bude dál

Vývojáři z Ionicu se chtějí zaměřit především na zrychlení startu aplikace a na zvýšení rychlosti. Průběžně budou zpracovávat uživatelský feedback k sekci lazy loadingu. Samozřejmostí je další oprava bugů v celém frameworku.
Vývojáři z Ionicu se chtějí zaměřit především na rychlost celé aplikace, především pak její start. Ionic není dokonalý, ale jak jsem psal výše, vývojáři Ionicu budou rádi za vaše náměty a pomoc. Třeba pak budete mít dobrý pocit, že jste něco vrátili opensource komunitě.

Koho by zajímal další progres Ionicu, může je sledovat na Twitteru nebo se mrknout na jejich blog.

Žádné komentáře:

Okomentovat