Hay varias de estas aplicaciones de escritorio en las que el objetivo es mostrar su sitio en diferentes dimensiones, todo al mismo tiempo. Por lo tanto, puede, por ejemplo, escribir CSS y asegurarse de que funcione en todas las ventanas gráficas de un solo vistazo.
Todos son muy similares. Por ejemplo, hacen “duplicación de eventos”, lo que significa que si se desplaza en una ventana o dispositivo, todos los demás también lo hacen, junto con clics, escritura, etc. También puede acercar y alejar para ver muchos dispositivos a la vez, simplemente escalados. abajo. A ver si podemos eliminar alguna diferencia.
Sizzy
- Windows, Mac y Linux
- El plan “Solo” comienza en $ 5 / mes y tienen planes a partir de ahí
Hay un montón de pequeñas características geniales enfocadas en desarrolladores como:
- Elimine un puerto simplemente escribiendo el número de puerto
- Hay un modo de inspección universal pero, aunque no puede aplicar un cambio en DevTools que afecte a todas las ventanas y dispositivos al mismo tiempo, al menos puede inspeccionar todos ellos y, al hacer clic, se activa la sesión correcta de DevTools.
- Acelere o desconéctese con un clic
- Desactivar JavaScript con un clic
- Active el modo de diseño con un clic (por ejemplo, cada elemento tiene
contenteditable). - Alterna para ocultar imágenes, desactivar todos los estilos, delinear todos los elementos, etc.
- Anule las fuentes con las opciones de fuentes de Google
Aplicación receptiva
- Windows, Mac y Linx
- Código abierto (Gratis)
- Modo de inspección universal que selecciona el contexto correcto de DevTools
- La opción para “Deshabilitar la validación SSL” es inteligente, en caso de que tenga problemas con el HTTPS local.
- Alternar modo oscuro con un clic
Blisk
- ventana y mac
- Gratis, con actualizaciones premium ($10/mes). Algunas de las funciones, como la sincronización de desplazamiento y la actualización automática, se enumeran como funciones premium, lo que me hace pensar que la versión gratuita las limita de alguna manera.
- La actualización automática es una buena idea. Configura un “observador” para ciertos tipos de archivos en ciertas carpetas, y si cambian, actualiza la página. Me imagino que la mayoría de los entornos de desarrollo tienen algún tipo de inyección de estilo o recarga de módulo en caliente, pero tenerlo disponible de todos modos es útil para los que no lo tienen.
- No hay un inspector universal de DevTools, pero puede abrir DevTools individualmente y tienen una herramienta de inspección universal personalizada para mostrar las dimensiones del modelo de caja de los elementos.
- Hay una pantalla de informe de errores personalizada.
- Puede habilitar el “Modo de navegación” para desactivar todas las cosas sofisticadas del dispositivo y simplemente usarlo como un navegador semi-regular.
polipano
- Windows, Mac y Linux
- Gratis, con planes premium a partir de $10/mes. Registrarse le dará un buen puñado de correos electrónicos de incorporación durante una semana (con la opción de optar por no participar).
- Tiene extensiones de navegador para que otros navegadores desplieguen su pestaña actual en Polypane.
- El modo de inspección universal me parece el más fluido del grupo, pero no llega tan lejos para propagar los cambios entre ventanas y dispositivos. ¡Alguien tiene que hacer esto! Sin embargo, tiene un panel “Live CSS” que inyectará CSS adicional a todos los dispositivos abiertos, lo cual es genial.
- Puede abrir dispositivos basados en puntos de interrupción en su propio CSS, ¡y realmente funciona!
Dúo
- Está en la Mac App Store por $5, pero su sitio web está fuera de línea, lo que lo hace parecer un poco muerto.
- No tiene características sofisticadas. Como su nombre lo indica, simplemente muestra el mismo sitio uno al lado del otro en dos columnas que se pueden cambiar de tamaño.
Revisar
- No es una aplicación de navegador independiente, sino una extensión del navegador. Me gusta esto porque puedo permanecer en un navegador canónico con el que ya me siento cómodo y que recibe actualizaciones periódicas.
- La vista de “puntos de interrupción” es una idea inteligente. Creo que debería mostrar su sitio en los puntos de interrupción en su CSS, pero, me parece roto. No estoy seguro de si este es un proyecto desarrollado activamente. (Supongo que no lo es).
¿Entonces?
¿Qué, quieres que elija un ganador?
Si bien me desconecté un poco del salto de aro y la incorporación de Polypane, creo que tiene el conjunto de características mejor considerado. Sizzy está cerca, pero la interfaz está más desordenada de una manera que no parece necesaria. Admito que me gusta cómo Blisk se enfoca realmente en “simplemente mire la vista móvil y luego llenaremos el resto del espacio con una vista más grande” porque es más parecido a cómo trabajo realmente. (Rara vez necesito ver una “pared de dispositivos” de pantallas móviles trivialmente diferentes).
El hecho de que Responsively sea gratuito y de código abierto es genial, pero ¿es sostenible? Creo que me siento más seguro indagando en aplicaciones que se ejecutan como un negocio. El hecho de que me quede en mi navegador normal con Re:View significa que en realidad tengo la mayor probabilidad de usarlo, pero se siente como un proyecto muerto en este momento, así que probablemente no lo haga. Entonces, por ahora, supongo que tendré que coronar a Polypane.