Sencha Touch, RhoMobile,
AppMobi e jQuery Mobile: um
comparativo entre plataformas
   para desenvolvimento de
   aplicações baseadas em
         padrões web

     Leonardo Melo Santos
      http://about.me/leonardomelosantos
Tópicos
● Mercado atual
● Desafio das empresas
● Aplicações nativas x mobile web
  applications
● A importância do HTML5
● Frameworks para desenvolvimento de web
  mobile applications
  ○ Sencha Touch, RhoMobile, AppMobi e jQuery
    Mobile
  ○ Bibliotecas utilizáveis para auxiliar os frameworks
  ○ Comparativo entre os frameworks
Objetivo
Comparar plataformas atualmente em
destaque na indústria de desenvolvimento de
web applications para dispositivos móveis.
Foram percebidas algumas evidências de que
é possível desenvolver aplicações deste tipo
com baixo custo, qualidade, produtividade e
com recursos semelhantes às aplicações de
framework nativo.
Números
● Existirá cerca de oito bilhões de conexões
  móveis em 2016, quase cinco bilhões delas
  com acesso a banda larga móvel. [Ericsson]

● No Brasil
  ○ Existem aproximadamente 19 milhões de
    smartphones;
  ○ Cerca de 40% já acessa a internet através do
    celular. Isso significa que a internet móvel tem
    números superiores aos que a internet, sem
    dispositivos móveis, apresentava no começo de
    2007.
Qual o desafio das empresas?

 Distribuir as aplicações para os usuários de
     smartphones, focando atingir várias
 plataformas e o maior número possível de
                 consumidores.
Quais os problemas?
● Frameworks e linguagens distintos;
● Custo elevado pelo tamanho da equipe;
● Custo elevado pelo plano de capacitação;
● Prazos maiores para distribuir as aplicações
  em todas as plataformas;
Alguma ideia?




        Usar HTML5,
      JavaScript e CSS
Em quê o HTML5 pode ajudar?
● Traz consigo importantes mudanças quanto ao
  papel do HTML;
● Entrega uma experiência de usuário mais rica e
  intuitiva dentro do navegador;
● Os navegadores já entendem HTML5 sem
  necessidade de plugins;
● É possível criar e utilizar recursos de vídeo,
  gráficos e armazenamento local de dados;
● Recursos que permitem descobrir a localização
  do dispositivo.
Frameworks específicos para apps nativas

● Android: Java no Eclipse, em qualquer
  computador e sistema operacional;
● iOS: Objective-C no Xcode, com MacOS;
● Windows Phone: C#/VB no Visual Studio,
  com Windows. Market Place (US$ 99/ano);
● BADA: C++ no Eclipse em qualquer
  computador e sistema operacional.
Frameworks específicos para apps nativas
Apps nativas x mobile web
      applications
Definições
● Aplicações nativas: São desenvolvidos com
  linguagens e ferramentas específicos da
  plataforma;
● Mobile web applications: Execução é feita através
  de navegadores de Internet;
● Aplicações híbridas: Executados de forma nativa,
  mas na verdade são mobile web applications
  executados internamente por um interpretador ou
  pseudo-browser.
Características
                          Vantagens                          Desvantagens

               - Total utilização dos recursos de   - Alto custo para desenvolvimento
               hardware e software                  - Curva de aprendizado para cada
Aplicações     - Alta performance                   plataforma
 nativas       - Melhor experiência de usuário      - Vários dispositivos
               - Facilidade para criação de jogos   - Várias plataformas


               - Padrão web (HTML, JavaScript,      - Recursos limitados
               CSS)                                 - Acessibilidade
Web mobile
               - Multi-dispositivos                 - Cross-domain (WebServices)
applications   - Multi-plataformas                  - Performance
               - Atualização em tempo real


               - Padrão web (HTML, JavaScript,      - Design único para todas as
               CSS)                                 plataformas
Aplicações     - Multi-dispositivos                 - Recursos limitados
 híbridas      - Multi-plataformas                  - Acessibilidade
                                                    - Cross-domain (WebServices)
                                                    - Performance
Frameworks para
desenvolvimento de mobile web
         applications
Frameworks para desenvolvimento
de mobile web applications
Serão abordados:
● Sencha Touch;
● RhoMobile;
● AppMobi;
● jQuery Mobile.
Sencha Touch
● Maior parte do programa é escrito em
    JavaScript;
●   Permite disponibilizar a aplicação num servidor
    de Internet (para que seja acessado via
    navegador);
●   Permite gerar um aplicativo nativo com o
    mesmo código-fonte (Android, iOS e
    BlackBerry);
●   Suporte a vários eventos como: início/fim de
    toque, início/fim de rolagem, toque, toque
    duplo, passagem de dedos e gesto de aperto.
●   Exemplos
RhoMobile
● Apps escritas em HTML + Ruby;
● Interfaces são compostas por elementos
  baseadas em páginas web e são
  visualizados como se estivessem num
  browser;
  ○ Execução da aplicação é de forma nativa porque ao
    compilar o programa é gerado internamente um
    interpretador, chamado Rhodes (funciona como um
    servidor dentro da aplicação);
● Atualmente é possível utilizar Rhodes
  applications nos sistemas BlackBerry,
  Windows Mobile, Android, iPhone e
RhoMobile - Arquitetura
AppMobi
● Ambiente de desenvolvimento funciona através de
  uma extensão de Chrome;
● Permite criar, depurar e construir tanto web mobile
  applications quanto híbridas (Android e iOS);
● Assim como SenchaTouch, o grau de facilidade no
  processo de desenvolvimento e distribuição coloca
  esta plataforma em destaque;
● Difunde e defende a utilização de linguagens de
  programação como o HTML5, CSS e JavaScript e
  web aberta;
● Foi adquirida recentemente pela Intel.
jQuery Mobile
● Plataforma baseada em HTML5, gratuita,
  unificada e otimizada para atender todas as
  plataformas populares de dispositivos
  móveis;
● Baseada nas outras bibliotecas jQuery e
  jQuery UI Foundation;
● Depende de ferramentas de terceiros para
  facilitar a construção da interface gráfica.
  Exemplos: Codiqa e ThemeRoller;
Porque o PhoneGap tem a ver?
● Nasceu de uma empresa com raízes profundas na cena
    JavaScript e desenvolvimento web em geral;
●   Apps são escritas com as tecnologias baseadas em
    padrões web (HTML5, CSS3 e JavaScript) e as
    disponibiliza para serem executados
●   como apps nativas (iOS, Android, Windows Phone,
    BlackBerry, WebOS, Symbian e Bada);
●   Possibilidade de utilizar recursos do celular, como
    bússola, câmera, acelerômetro, armazenamento de
    dados;
●   Sencha Touch, AppMobi e jQuery Mobile podem utilizar
    o PhoneGap para construir aplicações híbridas
Comparativo dos
  frameworks
Sencha Touch             RhoMobile              AppMobi              jQuery Mobile



    Categoria         Híbrido / web mobile         Híbrido         Híbrido / web mobile       web mobile

 Padrões web de       HTML5, JavaScript e    HTML5, JavaScript e   HTML5, JavaScript e    HTML5, JavaScript e
 desenvolvimento            CSS                    CSS                   CSS                    CSS

Linguagem exigida              -                    Ruby                    -                      -

   SDK Gratuito               Sim                    Sim                   Sim                   Sim

    Possui IDE                Sim                    Sim                   Sim                   Sim

   IDE Gratuita              Não                     Sim                   Sim                   Não

Construção de telas          Não                    Não                    Sim                   Sim
 de forma gráfica



 Recursos nativos              -               Câmera, GPS,          Acelerômetro,               Não
    acessíveis                                gestos, multimídia     geolocalização

   Permite usar               Sim                   Não                    Sim                   Não
    biblioteca
    PhoneGap

 Permite acessar              Sim                   Não                    Sim                   Sim
 aplicação como
 web mobile app

   Plataformas          Android, iOS e       BlackBerry, Windows      Android e iOS                -
  possíveis de           BlackBerry            Mobile, Android,
executar de forma                             iPhone e Windows
      nativa                                       Phone 7
Conclusões
● Relevantes ferramentas para desenvolvimento
  de apps baseadas em padrões web;
● Baixo custo, qualidade e produtividade;
● Comunidades do SenchaTouch e PhoneGap
  crescem (forum, conferências mundiais,
  surgimento de cursos, etc);
Conclusões


A comparação entre esses frameworks deixa evidências
de que existem soluções viáveis que colaborariam com o
 desafio da indústria de desenvolvimento de aplicativos
   para dispositivos móveis, visando atender o maior
    número de usuários, independe de fabricante de
      dispositivos ou plataforma utilizada por eles.

Sencha Touch, RhoMobile, AppMobi e jQuery Mobile um comparativo entre plataformas para desenvolvimento de aplicações baseadas em padrões web

  • 1.
    Sencha Touch, RhoMobile, AppMobie jQuery Mobile: um comparativo entre plataformas para desenvolvimento de aplicações baseadas em padrões web Leonardo Melo Santos http://about.me/leonardomelosantos
  • 2.
    Tópicos ● Mercado atual ●Desafio das empresas ● Aplicações nativas x mobile web applications ● A importância do HTML5 ● Frameworks para desenvolvimento de web mobile applications ○ Sencha Touch, RhoMobile, AppMobi e jQuery Mobile ○ Bibliotecas utilizáveis para auxiliar os frameworks ○ Comparativo entre os frameworks
  • 3.
    Objetivo Comparar plataformas atualmenteem destaque na indústria de desenvolvimento de web applications para dispositivos móveis. Foram percebidas algumas evidências de que é possível desenvolver aplicações deste tipo com baixo custo, qualidade, produtividade e com recursos semelhantes às aplicações de framework nativo.
  • 4.
    Números ● Existirá cercade oito bilhões de conexões móveis em 2016, quase cinco bilhões delas com acesso a banda larga móvel. [Ericsson] ● No Brasil ○ Existem aproximadamente 19 milhões de smartphones; ○ Cerca de 40% já acessa a internet através do celular. Isso significa que a internet móvel tem números superiores aos que a internet, sem dispositivos móveis, apresentava no começo de 2007.
  • 5.
    Qual o desafiodas empresas? Distribuir as aplicações para os usuários de smartphones, focando atingir várias plataformas e o maior número possível de consumidores.
  • 6.
    Quais os problemas? ●Frameworks e linguagens distintos; ● Custo elevado pelo tamanho da equipe; ● Custo elevado pelo plano de capacitação; ● Prazos maiores para distribuir as aplicações em todas as plataformas;
  • 7.
    Alguma ideia? Usar HTML5, JavaScript e CSS
  • 8.
    Em quê oHTML5 pode ajudar? ● Traz consigo importantes mudanças quanto ao papel do HTML; ● Entrega uma experiência de usuário mais rica e intuitiva dentro do navegador; ● Os navegadores já entendem HTML5 sem necessidade de plugins; ● É possível criar e utilizar recursos de vídeo, gráficos e armazenamento local de dados; ● Recursos que permitem descobrir a localização do dispositivo.
  • 9.
    Frameworks específicos paraapps nativas ● Android: Java no Eclipse, em qualquer computador e sistema operacional; ● iOS: Objective-C no Xcode, com MacOS; ● Windows Phone: C#/VB no Visual Studio, com Windows. Market Place (US$ 99/ano); ● BADA: C++ no Eclipse em qualquer computador e sistema operacional.
  • 10.
  • 11.
    Apps nativas xmobile web applications
  • 12.
    Definições ● Aplicações nativas:São desenvolvidos com linguagens e ferramentas específicos da plataforma; ● Mobile web applications: Execução é feita através de navegadores de Internet; ● Aplicações híbridas: Executados de forma nativa, mas na verdade são mobile web applications executados internamente por um interpretador ou pseudo-browser.
  • 13.
    Características Vantagens Desvantagens - Total utilização dos recursos de - Alto custo para desenvolvimento hardware e software - Curva de aprendizado para cada Aplicações - Alta performance plataforma nativas - Melhor experiência de usuário - Vários dispositivos - Facilidade para criação de jogos - Várias plataformas - Padrão web (HTML, JavaScript, - Recursos limitados CSS) - Acessibilidade Web mobile - Multi-dispositivos - Cross-domain (WebServices) applications - Multi-plataformas - Performance - Atualização em tempo real - Padrão web (HTML, JavaScript, - Design único para todas as CSS) plataformas Aplicações - Multi-dispositivos - Recursos limitados híbridas - Multi-plataformas - Acessibilidade - Cross-domain (WebServices) - Performance
  • 14.
    Frameworks para desenvolvimento demobile web applications
  • 15.
    Frameworks para desenvolvimento demobile web applications Serão abordados: ● Sencha Touch; ● RhoMobile; ● AppMobi; ● jQuery Mobile.
  • 16.
    Sencha Touch ● Maiorparte do programa é escrito em JavaScript; ● Permite disponibilizar a aplicação num servidor de Internet (para que seja acessado via navegador); ● Permite gerar um aplicativo nativo com o mesmo código-fonte (Android, iOS e BlackBerry); ● Suporte a vários eventos como: início/fim de toque, início/fim de rolagem, toque, toque duplo, passagem de dedos e gesto de aperto. ● Exemplos
  • 18.
    RhoMobile ● Apps escritasem HTML + Ruby; ● Interfaces são compostas por elementos baseadas em páginas web e são visualizados como se estivessem num browser; ○ Execução da aplicação é de forma nativa porque ao compilar o programa é gerado internamente um interpretador, chamado Rhodes (funciona como um servidor dentro da aplicação); ● Atualmente é possível utilizar Rhodes applications nos sistemas BlackBerry, Windows Mobile, Android, iPhone e
  • 19.
  • 20.
    AppMobi ● Ambiente dedesenvolvimento funciona através de uma extensão de Chrome; ● Permite criar, depurar e construir tanto web mobile applications quanto híbridas (Android e iOS); ● Assim como SenchaTouch, o grau de facilidade no processo de desenvolvimento e distribuição coloca esta plataforma em destaque; ● Difunde e defende a utilização de linguagens de programação como o HTML5, CSS e JavaScript e web aberta; ● Foi adquirida recentemente pela Intel.
  • 22.
    jQuery Mobile ● Plataformabaseada em HTML5, gratuita, unificada e otimizada para atender todas as plataformas populares de dispositivos móveis; ● Baseada nas outras bibliotecas jQuery e jQuery UI Foundation; ● Depende de ferramentas de terceiros para facilitar a construção da interface gráfica. Exemplos: Codiqa e ThemeRoller;
  • 24.
    Porque o PhoneGaptem a ver? ● Nasceu de uma empresa com raízes profundas na cena JavaScript e desenvolvimento web em geral; ● Apps são escritas com as tecnologias baseadas em padrões web (HTML5, CSS3 e JavaScript) e as disponibiliza para serem executados ● como apps nativas (iOS, Android, Windows Phone, BlackBerry, WebOS, Symbian e Bada); ● Possibilidade de utilizar recursos do celular, como bússola, câmera, acelerômetro, armazenamento de dados; ● Sencha Touch, AppMobi e jQuery Mobile podem utilizar o PhoneGap para construir aplicações híbridas
  • 26.
    Comparativo dos frameworks
  • 27.
    Sencha Touch RhoMobile AppMobi jQuery Mobile Categoria Híbrido / web mobile Híbrido Híbrido / web mobile web mobile Padrões web de HTML5, JavaScript e HTML5, JavaScript e HTML5, JavaScript e HTML5, JavaScript e desenvolvimento CSS CSS CSS CSS Linguagem exigida - Ruby - - SDK Gratuito Sim Sim Sim Sim Possui IDE Sim Sim Sim Sim IDE Gratuita Não Sim Sim Não Construção de telas Não Não Sim Sim de forma gráfica Recursos nativos - Câmera, GPS, Acelerômetro, Não acessíveis gestos, multimídia geolocalização Permite usar Sim Não Sim Não biblioteca PhoneGap Permite acessar Sim Não Sim Sim aplicação como web mobile app Plataformas Android, iOS e BlackBerry, Windows Android e iOS - possíveis de BlackBerry Mobile, Android, executar de forma iPhone e Windows nativa Phone 7
  • 28.
    Conclusões ● Relevantes ferramentaspara desenvolvimento de apps baseadas em padrões web; ● Baixo custo, qualidade e produtividade; ● Comunidades do SenchaTouch e PhoneGap crescem (forum, conferências mundiais, surgimento de cursos, etc);
  • 29.
    Conclusões A comparação entreesses frameworks deixa evidências de que existem soluções viáveis que colaborariam com o desafio da indústria de desenvolvimento de aplicativos para dispositivos móveis, visando atender o maior número de usuários, independe de fabricante de dispositivos ou plataforma utilizada por eles.