Capacitor 1.0 visa melhorar a criação de apps híbridos, web e nativos

O Capacitor, atualmente na versão 1.0, é um novo runtime multiplataforma da Ionic, que visa criar aplicativos para iOS, Android e Web usando JavaScript. O Capacitor tenta trazer uma nova visão sobre como criar aplicativos multi plataforma que acessam recursos nativos.

Da mesma maneira que o Cordova, o objetivo do Capacitor é possibilitar o acesso dos recursos nativos do sistema operacional subjacente a um aplicativo, sem a necessidade de escrever um código específico da plataforma. Isso possibilita usar, por exemplo, a câmera do dispositivo usando o mesmo código em aplicativos iOS, Android e Electron Apps. O Capacitor, porém, adota uma abordagem radicalmente diferente para gerenciar um aplicativo HTML / CSS / JavaScript para executá-lo em uma WebView nativa e expor a funcionalidade nativa do aplicativo por meio de uma interface unificada.

Uma grande diferença em relação ao Cordova é que o Capacitor exige que os desenvolvedores manuseiem o projeto do aplicativo nativo, a parte que inclui o Web View no qual o aplicativo Ionic é executado, como um componente do aplicativo Capacitor, e não o contrário. Essa abordagem facilita a integração de SDKs externos que podem exigir o aprimoramento do AppDelegate no iOS, bem como a integração de funcionalidade nativa de um aplicativo Ionic sem a necessidade de um plug-in adequado, como no caso do Cordova.

Outro benefício do Capacitor é que ele não exige mais que você escute o evento deviceready. Isso é possível graças ao Capacitor que carrega todos os plug-ins antes que o aplicativo Ionic seja carregado, para que eles fiquem imediatamente disponíveis. Além disso, os plug-ins do Capacitor expõem métodos que podem ser chamados, portanto, você não precisa usar exec Este é um simples exemplo de plug-ins para IOS do Capacitor, uma classe Swift que estende o CAPPlugin:

import Capacitor

@objc(MyPlugin)
public class MyPlugin: CAPPlugin {
  @objc func echo(_ call: CAPPluginCall) {
    let value = call.getString("value") ?? ""
    call.resolve([
        "value": value
    ])
  }
}

Para tornar o plugin echo disponível diretamente para runtime web do Capacitor, é necessário registrá-lo em um arquivo .m:

#import <Capacitor/Capacitor.h>

CAP_PLUGIN(MyPlugin, "MyPlugin",
  CAP_PLUGIN_METHOD(echo, CAPPluginReturnPromise);
)

O Capacitor usa o npm para gerenciar as dependências, incluindo plugins e plataformas. Então, quando é preciso usar um plug-in, basta executar a npm install como de costume para um projeto JavaScript. Com o Cordova, você deve usar o comando cordova plugin add .... Como uma simplificação adicional, o Capacitor exige que o componente nativo dos plug-ins do iOS seja empacotado como um CocoaPod e, para o Android, como uma biblioteca.

Como nota final, o Capacitor eventualmente substituirá o Cordova como o modo oficial de gerenciar os aplicativos Ionic para que eles possam acessados nativamente em várias plataformas, mas o Cordova será suportado por muitos anos, segundo a Ionic.