¿Cuáles son las soluciones comunes de implementación de integración front-end? ¿Cuáles son sus ventajas y desventajas?
Especificaciones de desarrollo: incluidas especificaciones de directorio y especificaciones de codificación para el desarrollo y la implementación. No subestime el poder de las especificaciones, puede mejorar enormemente la eficiencia del desarrollo. Unas especificaciones realmente excelentes no harán que los usuarios se sientan limitados, pero les ayudarán a localizar problemas rápidamente y mejorar la eficiencia.
Desarrollo modular: Para js y css, organiza el código por función o negocio. JS resuelve los problemas de alcance independiente, gestión de dependencias, exposición de API, carga y ejecución bajo demanda, y CSS resuelve los problemas de gestión de dependencias de componentes y gestión de estilos internos. Es una base importante para mejorar la eficiencia del desarrollo front-end. Los marcos modulares populares ahora incluyen requirejs, seajs, etc.
Desarrollo basado en componentes: sobre la base de la modularización, los fragmentos de código js, css y html de los widgets de la página se combinan para su desarrollo y mantenimiento. Las unidades de componentes son independientes de los recursos y pueden reutilizarse en el sistema. Como encabezados, pies de página, barras de búsqueda, menús, cuadros de diálogo e incluso algunos componentes complejos como editores. Por lo general, la empresa encapsulará la parte js del componente para resolver algunos problemas comunes de representación e interacción de componentes.
Biblioteca de componentes: a través de la componenteización, esperamos poner algunos componentes muy comunes en un lugar común para que el equipo los disfrute y facilite la reutilización en nuevos proyectos. En este punto, necesitamos importar algo de una biblioteca de componentes. Las bibliotecas de componentes populares ahora incluyen Bower y Component. Una vez que el equipo crezca hasta cierto tamaño, la necesidad de bibliotecas de componentes será muy fuerte.
Optimización del rendimiento: aquí la optimización del rendimiento se refiere a los puntos de optimización del rendimiento que se pueden garantizar mediante medios de ingeniería. Debido a que el contenido es rico, no entraré en detalles aquí. Los estudiantes interesados pueden leer mis dos artículos [1] [2]. La optimización del rendimiento es un proceso necesario para que los proyectos front-end alcancen una determinada etapa. ¿Qué quiero enfatizar en esta parte? La optimización del rendimiento debe ser un problema de ingeniería además de un problema estadístico. La optimización del rendimiento que no se puede garantizar por medios de ingeniería no es confiable. También es unilateral considerar solo la primera carga de la página sin considerar la optimización general y la mejora en las estadísticas macro.
Implementación del proyecto: de acuerdo con la división laboral actual de la industria, aunque no es un trabajo front-end, tiene un impacto directo en la optimización del rendimiento, incluidos problemas como el almacenamiento en caché de recursos estáticos, CDN y no -publicación de cobertura. La implementación razonable de recursos estáticos puede brindar un mayor espacio para la optimización del rendimiento del front-end.
Proceso de desarrollo: el proceso de desarrollo completo incluye desarrollo y depuración local, inspección y confirmación de efectos visuales, depuración, pruebas y lanzamiento conjuntos de front-end y back-end. Las mejoras en el proceso de desarrollo pueden reducir en gran medida el costo de tiempo del desarrollo. En los últimos años, he visto muchos sistemas independientes (sistema cms y sistema de envío de recursos estáticos) separar el proceso de desarrollo, lo que obstaculiza seriamente la eficiencia del desarrollo front-end.
Herramientas de desarrollo: las herramientas mencionadas aquí no son IDE, sino herramientas de ingeniería, incluidas herramientas de proceso como herramientas de optimización de construcción, desarrollo-depuración-implementación, así como herramientas relacionadas, como adquisición y envío de bibliotecas de componentes. e incluso herramientas de plataforma como operaciones, documentación y lanzamiento de configuración. El desarrollo de front-end requiere soporte de herramientas. La raíz de este problema proviene de las características del lenguaje del dominio de front-end (escribiré un artículo separado para presentar los defectos del lenguaje del dominio de front-end en el futuro). Los lenguajes utilizados en el desarrollo front-end (js, css, html) y la estrategia de carga y posicionamiento de los recursos de ingeniería front-end determinan que la ingeniería front-end debe estar respaldada por herramientas. Debido a que estas herramientas suelen ser sistemas independientes, si desea encadenarlas, existe un paquete como yeoman. Los siete elementos técnicos mencionados anteriormente tienen un impacto directo o indirecto en el diseño de herramientas de desarrollo front-end, por lo que es muy importante si otros elementos técnicos se pueden conectar en serie para formar un sistema de desarrollo y optimización de front-end coherente y sostenible. .