OpenWebinars

Desarrollo Web

Tauri: Crea aplicaciones de escritorio con tecnologías web

Imagina poder crear aplicaciones de escritorio rápidas, seguras y eficientes utilizando tus habilidades como desarrollador web. Con Tauri, es posible. En este artículo te contamos cómo Tauri facilita la creación de aplicaciones de escritorio con tecnologías web, ofreciendo una alternativa moderna y potente a otras soluciones tradicionales.

Alfredo Barragán

Alfredo Barragán

Experto Full Stack con PHP y JavaScript

Lectura 7 minutos

Publicado el 9 de julio de 2024

Compartir

Introducción

¿Sabías que Tauri puede reducir el tamaño de las aplicaciones de escritorio en más del 90% en comparación con otras soluciones como Electron?

Esto significa aplicaciones más rápidas y menos consumo de recursos.

Descubre cómo Tauri logra esta eficiencia y cómo puedes aprovechar sus capacidades para desarrollar aplicaciones de escritorio más ligeras y seguras.

Importancia de las aplicaciones de escritorio en la actualidad

Las aplicaciones de escritorio siguen siendo vitales para muchas empresas y usuarios por diversas razones, como puede ser ofrecer un rendimiento superior al de las aplicaciones web, permitir una mayor integración con el sistema operativo y permitir su funcionamiento sin conexión a internet.

Además, muchas aplicaciones críticas y herramientas de productividad aún dependen de entornos de escritorio para ofrecer una experiencia de usuario robusta y confiable.

Qué es Tauri

Tauri es un Framework para desarrollar aplicaciones de escritorio utilizando tecnologías web como HTML, CSS y JavaScript.

A diferencia de otros Frameworks similares, Tauri se centra en la creación de aplicaciones ligeras, seguras y eficientes.

Utiliza Rust para el Backend y Webview para renderizar la interfaz de usuario, lo que permite una integración perfecta entre el Frontend y el Backend.

Propósito de Tauri

El propósito principal de Tauri es proporcionar a los desarrolladores una herramienta para crear aplicaciones de escritorio modernas que sean pequeñas en tamaño, rápidas en ejecución y seguras.

Tauri busca resolver las limitaciones de otros Frameworks, como Electron, ofreciendo una alternativa más ligera y eficiente.

Aprende a desarrollar webs optimizadas
Comienza 15 días gratis en OpenWebinars y accede cursos, talleres y laboratorios prácticos de JavaScript, React, Angular, HTML, CSS y más.
Registrarme ahora

Beneficios de Tauri en el desarrollo de aplicaciones de escritorio

Aplicaciones más ligeras y eficientes

Uno de los mayores beneficios de Tauri es que produce aplicaciones significativamente más ligeras que las creadas con otros Frameworks como Electron.

Esto se debe a que Tauri no incluye una instancia del navegador completo dentro de cada aplicación, sino que utiliza el motor Webview del sistema operativo, lo que redunda en una mayor eficiencia de la aplicación.

Mayor seguridad

Tauri utiliza Rust, un lenguaje de programación conocido por su seguridad y eficiencia. Rust destaca por su sistema de manejo de memoria que elimina la posibilidad de errores comunes como los desbordamientos de búfer o las referencias colgantes.

Todos estos aspectos son fuentes frecuentes de vulnerabilidades de seguridad en otros lenguajes. Esto se traduce en aplicaciones más robustas y menos susceptibles a ataques.

Además de las ventajas inherentes de Rust, Tauri ofrece una configuración predeterminada de seguridad que minimiza la superficie de ataque. Por ejemplo, restringe el acceso directo al sistema de archivos y a otros recursos sensibles del sistema operativo desde la aplicación web, a menos que se otorguen permisos explícitos.

Este modelo de seguridad basado en permisos asegura que solo las partes de la aplicación que realmente necesitan acceso a recursos sensibles lo obtengan, reduciendo el riesgo de explotación por parte de atacantes externos.

Tauri también proporciona un entorno seguro mediante el aislamiento de los contextos de ejecución del Frontend y el Backend. El Frontend, desarrollado con tecnologías web, se ejecuta en un contexto restringido, mientras que el Backend, desarrollado en Rust, maneja las operaciones sensibles y potencialmente peligrosas.

Esta separación garantiza que el código JavaScript del Frontend no pueda acceder directamente a funciones críticas del sistema sin pasar por las barreras de seguridad establecidas en el Backend.

Asimismo, Tauri soporta la implementación de políticas de seguridad estrictas como Content Security Policy (CSP) para prevenir ataques como la inyección de código y el cross-site scripting (XSS). Estas políticas ayudan a asegurar que solo el código de origen confiable sea ejecutado, mitigando la posibilidad de que código malicioso se infiltre en la aplicación.

Compatibilidad multiplataforma

Tauri permite desarrollar aplicaciones que funcionen en múltiples sistemas operativos, incluyendo Windows, macOS y Linux.

Esto facilita la distribución de una única base de código en diferentes plataformas, lo que reduce considerablemente el tiempo de desarrollo.

Uso de tecnologías web

Tauri permite a los desarrolladores utilizar tecnologías web como HTML, CSS y JavaScript, lo que hace más sencillo la construcción de interfaces de usuario y permite aprovechar las habilidades existentes de los desarrolladores web, además es compatible con los Framework, más populares, de JavaScript, por lo que si conoces algunos de ellos la curva de aprendizaje es menor.

Arquitectura de Tauri

Integración de Rust y Webview

La arquitectura de Tauri se basa en la integración de Rust y Webview. Rust se utiliza para escribir el Backend de la aplicación, proporcionando un entorno seguro y eficiente.

Webview, por otro lado, se encarga de renderizar la interfaz de usuario utilizando el motor del navegador del sistema operativo.

Comunicación entre Frontend y Backend

Tauri facilita la comunicación entre el Frontend (JavaScript) y el Backend (Rust) a través de un sistema de mensajes, lo que permite una interacción fluida y eficiente entre ambos componentes, además su implementación es realmente sencilla.

Sistema de plugins

Tauri soporta un sistema de plugins que permite a los desarrolladores extender la funcionalidad de la aplicación. Estos plugins pueden ser utilizados para añadir características específicas sin afectar el núcleo de la aplicación.

Algunos de los plugins más utilizados son:

  • API Plugin proporciona acceso a las API nativas de Tauri, permitiendo el manejo de ventanas, notificaciones, almacenamiento, y más.
  • File System Plugin ofrece capacidades avanzadas para la manipulación del sistema de archivos, incluyendo lectura, escritura y manipulación de archivos y directorios.
  • HTTP Plugin facilita la realización de solicitudes HTTP desde el Backend de Rust, soportando operaciones como GET, POST, PUT y DELETE.
  • Tauri Notification Plugin proporciona soporte para notificaciones del sistema operativo, permitiendo el envío de notificaciones locales y personalizadas.
  • Updater Plugin gestiona las actualizaciones automáticas de la aplicación, permitiendo la comprobación, descarga e instalación de nuevas versiones de la aplicación.
  • Window Plugin ofrece capacidades avanzadas para la gestión de ventanas, incluyendo la creación, cierre y manipulación de propiedades de ventanas.
  • Event Plugin facilita la comunicación de eventos entre el Frontend y el Backend, permitiendo la emisión y escucha de eventos personalizados.

Tauri vs Electron

Tauri y Electron son Frameworks populares para el desarrollo de aplicaciones de escritorio, pero tienen enfoques diferentes.

Mientras que Electron incluye un navegador completo (Chromium) dentro de cada aplicación, lo que resulta en aplicaciones más grandes y pesadas, Tauri utiliza Webview del sistema operativo, lo que hace que las aplicaciones sean mucho más ligeras.

Además, Tauri ofrece una mejor seguridad al utilizar Rust, y una menor huella de memoria.

Desafíos comunes usando Tauri

Limitaciones técnicas

Aunque Tauri ofrece muchos beneficios, también presenta algunas limitaciones técnicas, como la necesidad de instalar Rust y una posible curva de aprendizaje para aquellos que no están familiarizados con este lenguaje.

Gestión de dependencias

La gestión de dependencias puede ser un desafío, especialmente cuando se integran múltiples tecnologías y lenguajes. Tauri intenta mitigar esto con herramientas de gestión específicas, pero sigue siendo un aspecto a considerar.

Como normal general, en un proyecto de Tauri tenemos que gestionar dos tipos de dependencias:

Rust

Para la gestión de dependencias de Rust, Cargo es la herramienta oficial. Utiliza el archivo Cargo.toml para declarar dependencias y gestionar sus versiones.

Cargo incluye comandos útiles como:

  • cargo build: Compila el proyecto.
  • cargo update: Actualiza las dependencias a sus últimas versiones compatibles.
  • cargo check: Verifica que el código se compile sin generar el binario final.

Node.js

Para gestionar este tipo de dependencias podemos utilizar el gestor de paquetes NPM o Yarn. Utilizando en la terminal el comando npm install o yarn install para instalar las dependencias listadas en package.json. Además, disponemos estos otros comandos:

  • npm outdated/ yarn outdated: Muestra una lista de dependencias desactualizadas.
  • npm update/ yarn upgrade: Actualiza todas las dependencias a sus últimas versiones compatibles.

Actualizaciones

Mantener las aplicaciones actualizadas puede ser complicado, especialmente cuando hay que asegurar la compatibilidad entre Rust, Webview y otros componentes del sistema operativo.

Para manejar las actualizaciones en una aplicación basada en Tauri, se pueden implementar varias estrategias. Una opción común es integrar un sistema de actualización automática dentro de la aplicación, utilizando herramientas como tauri-plugin-update que facilitan la verificación y descarga de nuevas versiones.

Este enfoque asegura que los usuarios siempre tengan acceso a las últimas mejoras y parches de seguridad sin necesidad de intervención manual.

Además, es importante comunicar eficazmente estas actualizaciones a los usuarios. Una práctica recomendada es notificar a los usuarios directamente a través de la interfaz de la aplicación. Esto puede lograrse mediante la implementación de mensajes emergentes (pop-ups) o notificaciones dentro de la aplicación que informen sobre la disponibilidad de una nueva versión.

Estas notificaciones pueden incluir información detallada sobre las mejoras y correcciones de errores que trae la actualización, así como un enlace o un botón para iniciar el proceso de actualización.

También es útil mantener a los usuarios informados sobre las actualizaciones a través de otros canales de comunicación, como correos electrónicos, redes sociales o un blog oficial. De esta manera, los usuarios pueden estar al tanto de las novedades y entender la importancia de mantener la aplicación actualizada para disfrutar de un rendimiento óptimo y características mejoradas.

Este es un ejemplo de implementación en Tauri de un sistema de notificaciones para posibles actualizaciones:

use tauri::{CustomMenuItem, Menu, MenuItem, Submenu};
use tauri_plugin_update::UpdaterBuilder;

fn main() {
  let context = tauri::generate_context!();

  let updater = UpdaterBuilder::default()
      .endpoints(["https://your-server.com/updates/{target}/{current_version}"])
      .build();

  tauri::Builder::default()
    .plugin(updater)
    .setup(|app| {
      let handle = app.handle();
      std::thread::spawn(move || {
        loop {
          tauri_plugin_update::check_update(&handle);
          std::thread::sleep(std::time::Duration::from_secs(3600));
        }
      });
      Ok(())
    })
    .invoke_handler(tauri::generate_handler![check_for_updates])
    .run(context)
    .expect("error while running tauri application");
}

#[tauri::command]
async fn check_for_updates() {
  tauri_plugin_update::check_update().await.unwrap();
}

Podemos invocar la función de Tauri en un script de javaScript de esta forma:

const { invoke } = window.__TAURI__.tauri;

async function checkForUpdates() {
  try {
    await invoke('check_for_updates');
    window.__TAURI__.notification.sendNotification({
      title: 'Actualización Disponible',
      body: 'Una nueva versión de la aplicación está disponible. Por favor, actualice para obtener las últimas funciones y mejoras.'
    });
  } catch (error) {
    console.error('Error al comprobar actualizaciones', error);
  }
}

document.addEventListener('DOMContentLoaded', () => {
  checkForUpdates();
});

Además, debes tener un servidor configurado para alojar las actualizaciones. El endpoint configurado (https://your-server.com/updates/{{target}}/{{current_version}}) debe devolver información sobre la nueva versión disponible. Puedes usar herramientas como tauri-updater-server para gestionar esta funcionalidad.

De esta forma, cada vez que el usuario entre en la aplicación se consultará el endpoint e informará al usuario si existe una nueva versión.

Curva de aprendizaje

La curva de aprendizaje al adoptar Tauri puede ser significativa para desarrolladores familiarizados con otros Frameworks de desarrollo de aplicaciones de escritorio. Esto se debe principalmente a dos factores clave:

  • Integración de Rust: Tauri está construido sobre Rust, un lenguaje conocido por su velocidad, seguridad y control de memoria sin basura. Si bien Rust ofrece ventajas significativas en términos de rendimiento y seguridad, su sintaxis y paradigmas pueden ser nuevos para los desarrolladores que vienen de entornos donde se utilizan principalmente lenguajes interpretados como JavaScript o Python. Dominar Rust implica aprender su sistema de tipos, la gestión de la memoria a través de su sistema de propiedades y la sintaxis específica para manejar concurrencia de manera segura.

  • Estructura y filosofía de Tauri: A diferencia de Frameworks más tradicionales como Electron, Tauri adopta una filosofía diferente que favorece la ligereza y el rendimiento mediante el uso de Webview para renderizar la interfaz de usuario en lugar de incluir un navegador completo. Esto requiere que los desarrolladores entiendan cómo funcionan las aplicaciones web embebidas y cómo interactúan con el Backend de Rust. Además, Tauri proporciona un conjunto de herramientas y configuraciones específicas que pueden requerir tiempo para dominar completamente, especialmente en términos de configuración, manejo de dependencias y optimización del flujo de trabajo.

Construye interfaces de usuarios personalizadas y atractivas
Lleva la formación de tu equipo al siguiente nivel con cursos, talleres y laboratorios prácticos de JavaScript, React, Angular, HTML, CSS y más.
Solicitar más información

Conclusiones

Tauri es una opción muy potente y moderna concebida para el desarrollo de aplicaciones de escritorio, ofreciendo aplicaciones ligeras, seguras y eficientes.

Su enfoque en la utilización de Rust y Webview permite crear aplicaciones con un rendimiento superior y una mayor seguridad comparado con otras tecnologías como Electron.

A pesar de algunos desafíos, Tauri se presenta como una solución viable y prometedora en el campo del desarrollo de aplicaciones de escritorio.

Bombilla

Lo que deberías recordar de Tauri

  • Tauri produce aplicaciones más ligeras que Frameworks como Electron.
  • Rust ofrece mejoras en seguridad, muy sencillas de implementar con configuraciones de seguridad predeterminadas.
  • Tauri es multiplataforma, funciona en Windows, macOS y Linux.
  • Usa tecnologías web, lo que permite desarrollar con HTML, CSS y JavaScript, además es compatible con los principales Frameworks de JS.
  • Su sistema de plugins facilita la extensión de funcionalidades nativas.
Compartir este post

También te puede interesar