Tema 1 Desarrollo Web en Entorno Cliente.
- Introducción.
- Evolución y características de los navegadores web.
- Arquitectura y ejecución.
- Tecnologías de programación en entorno cliente.
Índice
1. Introducción.
La arquitectura cliente-servidor es un modelo de aplicación distribuida en el que las tareas se reparten entre los proveedores de recursos o servicios, llamados servidores, y los demandantes, llamados clientes. Un cliente realiza peticiones a otro programa, el servidor, quien le da respuesta.
Esta idea también se puede aplicar a programas que se ejecutan sobre una sola computadora, aunque es más ventajosa en un sistema operativo multiusuario distribuido a través de una red de computadoras.
En esta arquitectura la capacidad de proceso está repartida entre los clientes y los servidores, aunque son más importantes las ventajas de tipo organizativo debidas a la centralización de la gestión de la información y la separación de responsabilidades, lo que facilita y clarifica el diseño del sistema.
La separación entre cliente y servidor es una separación de tipo lógico, donde el servidor no se ejecuta necesariamente sobre una sola máquina ni es necesariamente un sólo programa. Los tipos específicos de servidores incluyen los servidores web, los servidores de archivo, los servidores del correo, etc. Mientras que sus propósitos varían de unos servicios a otros, la arquitectura básica seguirá siendo la misma.
Una disposición muy común son los sistemas multicapa en los que el servidor se descompone en diferentes programas que pueden ser ejecutados por diferentes computadoras aumentando así el grado de distribución del sistema.
La red cliente-servidor es una red de comunicaciones en la cual los clientes están conectados a un servidor, en el que se centralizan los diversos recursos y aplicaciones con que se cuenta; y que los pone a disposición de los clientes cada vez que estos son solicitados. Esto significa que todas las gestiones que se realizan se concentran en el servidor, de manera que en él se disponen los requerimientos provenientes de los clientes que tienen prioridad, los archivos que son de uso público y los que son de uso restringido, los archivos que son de sólo lectura y los que, por el contrario, pueden ser modificados, etc. Este tipo de red puede utilizarse conjuntamente en caso de que se este utilizando en una red mixta.
Cliente-Servidor. Wikipedia.Características:
En la arquitectura C/S el remitente de una solicitud es conocido como cliente. Sus características son:
- Es quien inicia solicitudes o peticiones, tienen por tanto un papel activo en la comunicación (dispositivo maestro o amo).
- Espera y recibe las respuestas del servidor.
- Por lo general, puede conectarse a varios servidores a la vez.
- Normalmente interactúa directamente con los usuarios finales mediante una interfaz gráfica de usuario.
- Al contratar un servicio de redes, se debe tener en cuenta la velocidad de conexión que le otorga al cliente y el tipo de cable que utiliza , por ejemplo : cable de cobre ronda entre 1 ms y 50 ms.
Al receptor de la solicitud enviada por el cliente se conoce como servidor. Sus características son:
- Al iniciarse esperan a que lleguen las solicitudes de los clientes, desempeñan entonces un papel pasivo en la comunicación (dispositivo esclavo).
- Tras la recepción de una solicitud, la procesan y luego envían la respuesta al cliente.
- Por lo general, aceptan conexiones desde un gran número de clientes (en ciertos casos el número máximo de peticiones puede estar limitado).
- No es frecuente que interactúen directamente con los usuarios finales.
1. Evolución y características de los navegadores web.
El navegador web es el vehículo y la principal herramienta de cualquiera que se adentre en el mundo virtual de internet.
Lógicamente la velocidad, la ligereza a la que te muevas, la seguridad que te pueda dar, hasta que lugares remotos te pueda llevar, depende en gran parte del navegador que escojas y que tu decidas utilizar.
Para decidir eso, lo más adecuado entonces es informarte que navegadores están disponibles, cuáles son sus características, que funciones ofrecen, ver comparaciones entre ellos, conocer sus ventajas y desventajas, para al final decidirte y hacer tu elección. Facilitar estas opciones al usuario, es el objetivo de esta página.
¿Qué es un navegador o explorador web?
Un navegador web es el software o programa que nos permite ver la información que contiene una página web. Traduce el código HTML en el que está escrita la página y lo muestra en la pantalla, permitiéndonos interactuar con su contenido y navegar hacia otras páginas o sitios de la red, mediante enlaces o hipervínculos.
El seguimiento de los enlaces de una página a otra se llama navegación, que es de donde se origina el nombre de navegador web.
Navegadores Web. norfipc.com1. Arquitectura y ejecución.
Componentes principales del navegador.
- Interfaz de usuario: incluye la barra de direcciones, el botón de avance/retroceso, el menú de marcadores, etc. (en general, todas las partes visibles del navegador, excepto la ventana principal donde se muestra la página solicitada).
- Motor de búsqueda: coordina las acciones entre la interfaz y el motor de renderización.
- Motor de renderización: es responsable de mostrar el contenido solicitado. Por ejemplo, si el contenido solicitado es HTML, será el responsable de analizar el código HTML y CSS y de mostrar el contenido analizado en la pantalla.
- Red: es responsable de las llamadas de red, como las solicitudes HTTP. Tiene una interfaz independiente de la plataforma y realiza implementaciones en segundo plano para cada plataforma.
- Servidor de la interfaz: permite presentar widgets básicos, como ventanas y cuadros combinados. Muestra una interfaz genérica que no es específica de ninguna plataforma. Utiliza métodos de la interfaz de usuario del sistema operativo en segundo plano.
- Intérprete de JavaScript: permite analizar y ejecutar el código JavaScript.
- Almacenamiento de datos: es una capa de persistencia. El navegador necesita guardar todo tipo de datos en el disco duro (por ejemplo, las cookies). La nueva especificación de HTML (HTML5) define el concepto de "base de datos web", que consiste en una completa (aunque ligera) base de datos del navegador.
Es importante decir que Chrome, a diferencia de la mayoría de los navegadores, implementa varias instancias del motor de renderización, una por cada pestaña. Cada pestaña representa un proceso independiente.
How browsers work. html5rocks.com.
1. Tecnologías de programación en entorno cliente.
Lenguajes del lado cliente
- HTML
- JavaScript
- Applets de Java
- Visual Basic Script
- FLASH
- CSS
El lenguaje llamado HTML indica al navegador donde colocar cada texto, cada imagen o cada video y la forma que tendrán estos al ser colocados en la página.
El lenguaje consta de etiquetas que tienen esta forma <B> o <P>. Cada etiqueta significa una cosa, por ejemplo <B> significa que se escriba en negrita (bold) o <P> significa un párrafo, <A> es un enlace, etc. Casi todas las etiquetas tienen su correspondiente etiqueta de cierre, que indica que a partir de ese punto no debe de afectar la etiqueta. Por ejemplo </B> se utiliza para indicar que se deje de escribir en negrita. Así que el HTML no es más que una serie de etiquetas que se utilizan para definir la forma o estilo que queremos aplicar a nuestro documento. <B>Esto está en negrita</B>.
Esta página es un claro ejemplo de uso del HTML.
Javascript es un lenguaje de programación utilizado para crear pequeños programitas encargados de realizar acciones dentro del ámbito de una página web.
Se trata de un lenguaje de programación del lado del cliente, porque es el navegador el que soporta la carga de procesamiento. Su uso se basa fundamentalmente en la creación de efectos especiales en las páginas y la definición de interactividades con el usuario.
Las sentencias escritas en javascript se encapsulan entre las etiquetas <script> y </script>. por ejemplo, si en el código de una página Web incluimos la sentencia <script>window.alert("Bienvenido a mi sitio web. Gracias...") </script>
al abrir la página con el navegador se nos mostrará una ventana de bienvenida.
Es otra manera de incluir código a ejecutar en los clientes que visualizan una página web. Se trata de pequeños programas hechos en Java, que se transfieren con las páginas web y que el navegador ejecuta en el espacio de la página.
Los applets de Java están programados en Java y precompilados, es por ello que la manera de trabajar de éstos varía un poco con respecto a los lenguajes de script como Javascript. Los applets son más difíciles de programar que los scripts en Javascript y requerirán unos conocimientos básicos o medios del lenguaje Java.
La principal ventaja de utilizar applets consiste en que son mucho menos dependientes del navegador que los scripts en Javascript, incluso independientes del sistema operativo del ordenador donde se ejecutan. Además, Java es más potente que Javascript, por lo que el número de aplicaciones de los applets podrá ser mayor.
Como desventajas en relación con Javascript cabe señalar que los applets son más lentos de procesar y que tienen espacio muy delimitado en la página donde se ejecutan, es decir, no se mezclan con todos los componentes de la página ni tienen acceso a ellos. Es por ello que con los applets de Java no podremos hacer directamente cosas como abrir ventanas secundarias, controlar Frames, formularios, capas, etc.
Es un lenguaje de programación de scripts del lado del cliente, pero sólo compatible con Internet Explorer. Es por ello que su utilización está desaconsejada a favor de Javascript.
Está basado en Visual Basic, un popular lenguaje para crear aplicaciones Windows. Tanto su sintaxis como la manera de trabajar están muy inspirados en él. Sin embargo, no todo lo que se puede hacer en Visual Basic lo podremos hacer en Visual Basic Script, pues este último es una versión reducida del primero.
El modo de funcionamiento de Visual Basic Script para construir efectos especiales en páginas web es muy similar al utilizado en Javascript y los recursos a los que se puede acceder también son los mismos: el navegador.
Flash es una tecnología, y un programa, para crear efectos especiales en páginas web. Con Flash también conseguimos hacer páginas dinámicas del lado del cliente. Flash en realidad no es un lenguaje; Sin embargo, si tuvieramos que catalogarlo en algún sitio quedaría dentro del ámbito de las páginas dinámicas de cliente.
Para visualizar las "películas" Flash, nuestro navegador debe tener instalado un programita (plug-in) que le permita visualizarlas.
CSS, es una tecnología que nos permite crear páginas web de una manera más exacta. Gracias a las CSS somos mucho más dueños de los resultados finales de la página, pudiendo hacer muchas cosas que no se podía hacer utilizando solamente HTML, como incluir márgenes, tipos de letra, fondos, colores... Incluso podemos definir nuestros propios estilos en un archivo externo a nuestras páginas; así, si en algún momento queremos cambiar alguno de ellos, automáticamente se nos actualizarán todas las páginas vinculadas de nuestro sitio.
CSS son las siglas de Cascading Style Sheets, en español Hojas de estilo en Cascada.
Fuentes:
- Apuntes Desarrollo Web en Entorno Cliente IES Chan do Monte