Quelle est la différence entre le front-end Web et le front-end

Front-end est un terme général avec une portée plus large. Le front-end Web appartient au front-end du développement Web. Il s'agit d'une portée claire et la direction est plus claire et inclut le développement front-end mobile et. Le développement Web front-end, qui comprend le développement côté PC et le développement mobile dans le domaine des terminaux, tandis que le développement Web front-end fait principalement référence au développement Web traditionnel côté PC.

L'environnement d'exploitation de ce tutoriel : système Windows 7, ordinateur Dell G3.

Front-end est un terme général avec une portée plus large. Le front-end Web appartient au front-end du développement Web. Il a une portée et une direction plus claires. Le travail frontal de mise en œuvre du codage d'applications côté utilisateur basé sur la conception de produits/l'interface utilisateur appartient à la catégorie du développement front-end (y compris différentes formes d'application telles que le Web, l'application, le petit programme, le bureau, etc.) ; interface orientée utilisateur, d'une manière générale, le frontal inclut le frontal Web.

En termes simples, le développement front-end comprend le développement front-end mobile et le développement front-end Web, qui inclut le développement côté PC et le développement dans le domaine côté mobile. Le développement front-end Web fait principalement référence au Web côté PC traditionnel. développement de pages, qui est la plus grande différence entre eux.

Le développement front-end mobile et le développement front-end web appartiennent tous deux au développement front-end, avec les différences suivantes.

1. Scénarios d'applications commerciales

Le développement frontal Web fait principalement référence au développement de pages Web traditionnelles côté PC. Les pages sont principalement exécutées dans des navigateurs côté PC, et les pages développées par le front-end mobile sont principalement exécutées sur mobile. téléphones.

Intuitivement, vous sentirez que la page PC est plus grande et la page mobile est plus petite. Cependant, selon l'expérience de développement, une grande page ne signifie pas que le code écrit est compliqué, et une petite page ne signifie pas que le développement. est simple. La difficulté et la facilité dépendent principalement des besoins spécifiques de l'entreprise.

2. Utilisation des nouvelles technologies

Le terminal mobile étant principalement basé sur le noyau webkit, il prend mieux en charge les nouvelles technologies telles que HTML5, ce qui lui permet d'utiliser les nouvelles technologies à plus grande échelle, tandis que le développement sur PC nécessite de nombreux scénarios. . Compatible avec les anciennes versions de navigateurs tels que IE. En raison de considérations de compatibilité des navigateurs, l'utilisation des nouvelles technologies est limitée dans certains cas.

3. Adaptabilité des pages

Le développement traditionnel de pages côté PC choisit généralement de définir une largeur fixe pour la page, avec un espace blanc des deux côtés. Cependant, les pages côté mobile ont généralement des écrans plus petits que ceux des PC, car les écrans de leurs téléphones mobiles le sont. beaucoup plus petit que ceux des PC Choisir d'afficher autant de contenu que possible sur l'écran du téléphone mobile nécessite que la page mobile soit capable de s'adapter pleinement aux téléphones mobiles de différentes tailles d'écran et d'en tirer le meilleur parti.

De ce point de vue, l’adaptation des pages mobiles est plus difficile.

4. Performances de la page

La situation du réseau côté PC est généralement relativement stable, et le réseau est connecté via des câbles réseau ou Wi-Fi, mais du côté mobile est plus compliqué En plus du Wi-Fi, il y a. également 2G, 3G, 4G et même l'alternance entre plusieurs connexions réseau différentes est également fréquente.

Le défi que les connexions réseau instables apportent aux performances de la page est que les ressources de la page côté mobile ne peuvent pas être trop volumineuses, sinon la page sera inaccessible dans de mauvaises conditions de réseau, affectant sérieusement l'expérience utilisateur.

5. Sélection des cadres

En raison de l'instabilité du réseau mobile, lors de la sélection des cadres de pages mobiles, nous ne considérons généralement que les petits et beaux cadres. Par exemple, un comme zepto.js n'a que 9,6 Ko après compression. aux besoins des entreprises en général. Si vous souhaitez créer une application monopage plus complexe, vous pouvez choisir un framework comme vue.js, qui est puissant, mais la taille compressée n'est que supérieure à 20 Ko.

La gamme de choix côté Web est relativement large, et certains frameworks plus lourds peuvent également être envisagés en fonction des besoins du projet. Par exemple, l'ancien mais énorme ext.js est toujours actif dans les projets de systèmes de gestion backend de certaines entreprises. ses nombreux composants d’interface utilisateur.

Informations détaillées

Technologies requises pour le développement Web front-end :

1. Maîtriser la technologie de développement front-end (HTML5, JS, JSON, XHTML, CSS3) et comprendre les normes pertinentes de chaque technologie.

2. Maîtriser la programmation asynchrone Ajax et être capable d'écrire des composants frontaux hautes performances et réutilisables.

3. Avoir une compréhension approfondie des idées de programmation et des frameworks front-end tels que OO, MVC, MVVM, etc., et maîtriser un framework front-end (frameworks front-end courants Vuejs, AngularJS, React, Bootstrap, QUICK UI, les terminaux mobiles incluent : Frozen UI, weUI, SUI, MUI, AUI) comprendre ses principes (il existe de nombreux frameworks, choisir deux ou trois frameworks traditionnels, les maîtriser et avoir une compréhension approfondie).

4. Bon en optimisation des performances Web, en accessibilité, bonne expérience en SEO, etc.; comprendre la notion de séparation couche de présentation et couche de données, et la sémantique Web (ce sont aussi des points bonus très utiles lors de la recherche d'un emploi).

5. Comprenez le mécanisme de sécurité frontal et familiarisez-vous avec le protocole HTTP et les stratégies de mise en cache du navigateur.

6. Soyez familier avec l'implémentation du code source des frameworks de développement JS courants (tels que prototype, jQuery, Mootools, Ext, Dojo, underscore, YUI, Kissy) et maîtrisez au moins un d'entre eux (bien sûr, ne le faites pas). choisissez des frameworks que peu de gens utilisent), vous devez comprendre que les grands projets sont réalisés en équipe et que vous ne pouvez pas le faire vous-même).

7. Avoir une bonne expérience en rédaction de code et en rédaction de documents de conception, et maîtriser l'utilisation de Git et d'autres outils de contrôle de version.

8. Avoir une compréhension claire des problèmes courants de compatibilité des navigateurs et disposer de solutions fiables, telles que IE6/7/8/9, Firefox, Safari et Chrome.

9. Avoir une esthétique élevée (c'est très important. Si vous voyez plus de modèles et de projets haut de gamme, vous pouvez sentir le grand écart).

(Partage de vidéos d'apprentissage : Démarrer avec le front-end Web)

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!