- 1. Introducción
- 2. DOM
- 3. fetch
- 4. WebSockets
- 5. Web Storage
- 6. Fullscreen
- 7. Vibration
- 8. WebRTC
- 9. Canvas
- 10. WebGL
- 11. Picture in Picture
- 12. Speech
- 13. Referencias
Actualizado: Octubre 2023
El listado de APIs que se muestra a continuación está muy lejos de ser completo. Javascript tiene tantas APIs que es imposible abarcarlas todas. El listado que se muestra a continuación contiene aquellas APIs que personalmente considero de mayor interés.
Document Object Model
El modelo de objeto de documento (DOM) conecta páginas web con scripts o lenguajes de programación al representar la estructura de un documento, como el HTML que representa una página web, en la memoria. Por lo general, se refiere a JavaScript, aunque el modelado de documentos HTML, SVG o XML como objetos no forma parte del lenguaje principal de JavaScript.
El DOM representa un documento con un árbol lógico. Cada rama del árbol termina en un nodo y cada nodo contiene objetos. Los métodos DOM permiten el acceso programático al árbol. Con ellos, puede cambiar la estructura, el estilo o el contenido del documento.
Los nodos también pueden tener controladores de eventos adjuntos. Una vez que se activa un evento, los controladores de eventos se ejecutan.
El método fetch() inicia el proceso de obtener un recurso de la red, devolviendo una promesa que se cumple una vez que la respuesta está disponible.
La API Fetch proporciona una interfaz para obtener recursos (incluso a través de la red). Le parecerá familiar a cualquiera que haya usado XMLHttpRequest, pero la nueva API proporciona un conjunto de funciones más potente y flexible.
Permite a un servidor enviar mensajes al cliente
WebSockets es una tecnología avanzada que hace posible abrir una sesión de comunicación interactiva entre el navegador del usuario y un servidor. Con esta API, puede enviar mensajes a un servidor y recibir respuestas controladas por eventos sin tener que consultar al servidor para una respuesta.
Almacenamiento de datos en el cliente
La API de almacenamiento web proporciona los mecanismos mediante los cuales el navegador puede almacenar información de tipo clave/valor, de una forma mucho más intuitiva que utilizando cookies.
Los dos mecanismos en el almacenamiento web son los siguientes:
-
sessionStorage mantiene un área de almacenamiento separada para cada origen que está disponible mientras dure la sesión de la página (mientras el navegador esté abierto, incluyendo recargas de página y restablecimientos).
-
localStorage hace lo mismo, pero persiste incluso cuando el navegador se cierre y se reabra.
Presentación a pantalla completa en el cliente
La API fullscreen proporciona una manera fácil de presentar contenido web usando la pantalla completa del usuario y salir del modo de pantalla completa una vez que ya no sea necesario. Esto hace posible presentar el contenido deseado, como un juego en línea, utilizando toda la pantalla del usuario, eliminando todos los elementos de la interfaz de usuario del navegador y otras aplicaciones de la pantalla hasta que se apaga el modo de pantalla completa. .
Ofrece funcionalidad de vibración en dispositivos que lo soporten, como teléfonos móviles
La mayoría de los dispositivos modernos pueden vibrar a través del hardware, esto permite que a través del código de software se pueda emitir estas vibraciones. La Vibration API ofrece a las aplicaciones web la capacidad de acceder a este hardware en caso este lo soporte, caso contrario el dispositivo no hace nada.
Web real-time communications o comunicaciones web en tiempo real
WebRTC es una tecnología que permite a aplicaciones y sitios web capturar y opcionalmente retransmitir audio/vídeo, así como intercambiar datos arbitrarios entre navegadores sin necesidad de un intermediario. El conjunto de estándares que comprende WebRTC hace posible compartir datos y realizar teleconferencias de igual-a-igual (peer-to-peer), sin requerir que el usuario instale complementos (plug-ins) o cualquier otro software de terceros.
Proporciona un medio para dibujar gráficos a través de JavaScript y el elemento HTML <canvas>.
Entre otras cosas, se puede utilizar para animación, gráficos de juegos, visualización de datos, manipulación de fotografías y procesamiento de vídeo en tiempo real. Se centra principalmente en gráficos 2D.
La API de Canvas es extremadamente poderosa, pero no siempre es fácil de usar. Existen bibliotecas que pueden hacer que la creación de proyectos basados en lienzo sea más rápida y sencilla.
Permite representar gráficos 3D y 2D interactivos de alto rendimiento dentro de cualquier navegador web compatible sin el uso de complementos.
La compatibilidad con WebGL está presente en todos los navegadores modernos; sin embargo, el dispositivo del usuario también debe tener hardware que admita estas funciones.
Permite a los sitios web crear una ventana de vídeo flotante y siempre visible.
Esto permite a los usuarios seguir consumiendo medios mientras interactúan con otros sitios o aplicaciones en su dispositivo.
Permite incorporar datos de voz en aplicaciones web.
La API Web Speech tiene dos partes:
-
SpeechSynthesis(Texto a voz) -
SpeechRecognition(Reconocimiento de voz asincrónico).