JSON signifie JavaScript Object Notation. C'est un format de fichier standard ouvert utilisé pour les communications navigateur-serveur. C'est un format de données indépendant du langage. XML signifie Extensible Markup Language. XML représente un ensemble de règles qui aident les utilisateurs à coder des documents dans un format lisible par l'homme et par la machine. Pour cette dernière raison, Adam Stepinski, directeur de l’ingénierie chez Instawork et son équipe pensent que le format XML est le meilleur choix dans la conception des interfaces utilisateurs.
Stepinski et son équipe ont développé Hyperview XML (HXML), un nouveau format hypermédia basé sur XML et un client React Native pour le développement d'applications mobiles pilotées par serveur. Hyperview XML est un format hypermédia utilisé pour définir les écrans (interfaces utilisateurs) d'applications mobiles. HXML fournit un ensemble de balises et d'attributs qui permettent de définir la disposition d'un écran, le style et les interactions utilisateurs disponibles. Les comportements en HXML définissent les actions qui doivent se produire dans l'application.
Ces actions sont une réponse à un déclencheur basé sur l'utilisateur. Les comportements peuvent être spécifiés soit comme attributs sur d'autres éléments HXML, soit comme un élément enfant <behavior>. Selon l’équipe de développement de l’outil, sur le Web, les pages sont rendues dans un navigateur en récupérant le contenu HTML à partir d'un serveur. Avec HXML, les écrans sont rendus dans votre application mobile en récupérant du contenu Hyperview XML depuis un serveur. La conception de HXML reflète l'interface utilisateur et les modèles d'interaction des interfaces mobiles d'aujourd'hui.
Selon Stepinski, chaque format permet de faire des compromis en matière de codage, de flexibilité et d'expressivité pour répondre au mieux à un cas d'utilisation spécifique. Autrement dit, un format optimisé pour la taille utilisera un encodage binaire qui ne sera pas lisible par l'homme, un format optimisé pour l'extensibilité prendra plus de temps à décoder qu'un format conçu pour un usage restreint et enfin un format conçu pour des données plates (comme CSV pour Comma-separated values) aura du mal à représenter des données imbriquées.
Outre les propriétés intrinsèques d'un format, Stepinski explique aussi que des facteurs externes peuvent influencer ses cas d'utilisation pratique, tels que la popularité du format auprès des développeurs cibles ou le support des bibliothèques dans les langages de programmation souhaités. « Lorsqu'ils choisissent un format de fichier à utiliser dans un projet logiciel, les ingénieurs en logiciel choisissent celui qui présente le meilleur équilibre entre les caractéristiques et les facteurs externes pour la situation », a-t-il déclaré dans un billet explicatif.
Pour Stepinski, JSON représente un meilleur choix que XML dans l’utilisation des listes. Le format XML est plus utile pour exploiter les arbres
D’après Stepinski, par exemple, JSON représente un meilleur choix que XML dans l’utilisation des listes. Par contre, le format XML sera plus utile pour exploiter les arbres. Il estime que JSON est bien plus adapté que XML pour représenter des listes d'objets aux propriétés complexes. La syntaxe clé/valeur de l'objet JSON facilite les choses. En revanche, la syntaxe des attributs XML ne fonctionne que pour des types de données simples. L'utilisation d'éléments enfants pour représenter des propriétés complexes peut entraîner des incohérences ou une verbosité inutile.
Pour lui, JSON excelle dans la représentation d'une collection d'objets homogènes, où les propriétés des objets peuvent être des types de données composites. D’un autre côté, XML excelle dans la représentation d'arbres avec des objets hétérogènes, où les propriétés des objets sont des types de données simples. Dans ce cas de figure, lorsque l’on voit les interfaces utilisateurs comme des arbres, Stepinski dit que XML est le format de représentation le mieux adapté. Selon Stepinski, les dispositions de l'interface utilisateur sont des arbres.
Adam Stepinski
C’est la raison pour laquelle ils ont conçu Hyperview en se basant sur le format XML existant. Stepinski a expliqué que les arborescences de composants sont le meilleur moyen de représenter les mises en page de l'interface utilisateur et que tous les principaux frameworks d'interface utilisateur utilisent une arborescence de composants. D’après lui, Xcode fournit même une vue 3D éclatée qui met réellement en évidence l'arborescence sous-jacente d'une interface : chaque composant a un composant parent, et tout se transforme en un composant racine partagé.
« Les structures de l'interface utilisateur sont représentées sous forme d'arbres de composants. Et XML est idéal pour représenter des structures arborescentes. C'est un mariage fait au paradis ! En fait, les frameworks d'interface utilisateur les plus populaires dans le monde (HTML et Android) utilisent la syntaxe XML pour définir les modèles », a déclaré Stepinski. Il donne l’exemple de React, le framework de composants graphiques de Facebook, qui recommande aussi de définir l'interface utilisateur des composants à l'aide de JSX, un format semblable à XML.
D’après lui, même si l'utilisation de JSX nécessite l'apprentissage d'une nouvelle syntaxe non-JS et l'ajout d'une étape de transplantation au processus de compilation, les concepteurs de la bibliothèque estiment que cela vaut la peine d'utiliser XML. « Les arbres sont une représentation puissante pour les agencements d'interface utilisateur. Ils fournissent naturellement des regroupements de composants, permettant aux concepteurs et aux développeurs d'utiliser des abstractions de plus haut niveau », a-t-il expliqué, dans son billet.
« Lorsque nous avons besoin de cacher, afficher ou animer une section de l'écran, nous n'avons pas besoin de changer l'état de chaque composant de la section. Nous pouvons plutôt changer l'état du composant parent unique qui contient chaque élément de l'interface utilisateur de la section. Lors de la modification d'un composant, nous n'avons qu'à nous préoccuper de ce qui se trouve dans son sous-arbre, et non de ce qui se passe à des niveaux supérieurs », a-t-il conclu.
Source : Adam Stepinski
Et vous ?
Quel est votre avis sur le sujet ?
Que pensez-vous des arguments de Stepinski ? Êtes-vous du même avis ou pas ? Pourquoi ?
Quel type de format préférez-vous et pourquoi ?
Voir aussi
JavaScript : faut-il privilégier les transformations XML à JSON et aux Frameworks ? Partagez vos avis
React : la version 16.8 de la bibliothèque JavaScript est disponible et embarque une version stable des Hooks
Une interface utilisateur évidente est souvent la meilleure interface utilisateur. Concevez des interactions claires plutôt qu'intelligentes et les utilisateurs suivront, conseille Google Design
Google Chrome apporte des modifications à l'interface utilisateur de son navigateur, les changements sont disponibles sur Chrome Canary