Fermer

septembre 7, 2022

Votre application React a-t-elle besoin d’une feuille de calcul ou d’une grille de données ?

Votre application React a-t-elle besoin d’une feuille de calcul ou d’une grille de données ?


Comprenez les différences entre les feuilles de calcul et les grilles de données et les problèmes qu’elles résolvent le mieux afin de pouvoir faire le bon choix pour votre application React.

Feuilles de calcul et grilles de données: à première vue, ils peuvent sembler être des composants interchangeables. Étant donné que les deux utilisent un affichage tabulaire pour formater de grandes quantités de données, il peut être difficile de savoir quelle option choisir pour votre application React.

Cependant, malgré leurs apparences similaires, ils offrent des fonctionnalités très différentes et choisir le mauvais aura un impact négatif sur votre expérience utilisateur. Comprendre les différences entre les deux et les problèmes qu’ils résolvent le mieux vous permettra de faire les bons choix pour votre application React.

En fin de compte, il s’agit de savoir si l’objectif principal de vos utilisateurs est de modifier ou d’afficher les données. Il peut être utile d’imaginer les deux composants comme les deux côtés d’un diagramme de Venn : certaines fonctionnalités intermédiaires sont disponibles à la fois dans les feuilles de calcul et les grilles de données, mais la plupart de leurs ensembles de fonctionnalités sont orientés vers la réalisation de ces différents objectifs.

Un diagramme de Venn comparant les feuilles de calcul et les grilles de données

Là où les feuilles de calcul brillent

Feuilles de calcul sont idéales pour la saisie et l’édition de données complexes. Leur ensemble de fonctionnalités se concentre sur la capacité non seulement d’apporter des modifications à d’énormes pans de données à la fois, mais également d’exécuter des équations arithmétiques et d’autres mathématiques/financières. les fonctions sur les données. Certaines feuilles de calcul permettront également aux utilisateurs de créer des tableaux, des graphiques et d’autres visualisations de données basées sur les données. Fondamentalement, les données constituent le point de départ d’une feuille de calcul. Les utilisateurs s’attendent à pouvoir manipuler ces données, pas seulement à les visualiser.

Les feuilles de calcul offrent également la possibilité de séparer les données en plusieurs « feuilles », dont les données peuvent provenir de différentes sources et interagir de manière indépendante. Bien que ces feuilles puissent partager des données liées, elles fonctionnent finalement séparément les unes des autres. Cette capacité à gérer plusieurs groupes de données est une caractéristique distinctive notable.

Microsoft Excel est le logiciel qui a vraiment établi la barre pour l’expérience du tableur. Même dans les applications Web, de nombreux utilisateurs s’attendent à ce qu’un composant de feuille de calcul respecte ou dépasse les fonctionnalités disponibles auxquelles ils sont habitués à utiliser dans Excel. Ils s’attendront également à ce que la mise en page et l’interface utilisateur générale reflètent l’expérience Excel, vous êtes donc limité dans votre capacité à vraiment personnaliser le composant au-delà des ajustements au niveau de la surface (tels que la couleur, la forme des boutons, etc.). Parallèlement à cela, on s’attend à ce que votre composant fonctionne bien avec Excel, permettant à vos utilisateurs de télécharger et/ou exporter fichiers dans des types de fichiers compatibles Excel afin qu’ils puissent déplacer rapidement et facilement des données entre les applications.

Quand les grilles de données dominent

Grilles de données, en revanche, sont les plus adaptés pour afficher les données de plusieurs manières. Leurs fonctionnalités visent à donner aux utilisateurs tous les outils dont ils ont besoin pour mélanger et assortir la façon dont les données leur sont présentées, leur permettant de trouver des connexions dont ils n’étaient peut-être pas conscients auparavant. Les données sont l’objectif final, pas le point de départ d’une grille de données. Les utilisateurs s’attendent à pouvoir filtrer, trier, regrouper et autrement réorganiser la façon dont les données leur sont présentées lorsqu’ils utilisent une grille. La plupart des grilles de données autorisent des capacité d’éditionmais ce n’est pas l’objet du composant.

Pour cette raison, les grilles se concentrent généralement sur l’affichage des données d’une source de données unique. L’approche des « feuilles » à onglets d’une feuille de calcul n’est pas pertinente ici. Étant donné que l’utilisateur n’est pas concentré sur la modification des données, mises à jour en direct sont une caractéristique distinctive des grilles de données. Dans une feuille de calcul, vous ne voudriez pas que les données soient automatiquement mises à jour et actualisées en direct pendant qu’un utilisateur est en train d’exécuter des fonctions ou de faire des calculs avec. Vous voulez que l’utilisateur ait un contrôle total sur la mise à jour manuelle des données, donc vous ne ‘t interrompre leur travail.

En fin de compte, la plupart des utilisateurs s’attendent à ce que les grilles de données fonctionnent comme des tableaux de données fantaisistes (ce qui, pour être juste, est en quelque sorte le cas). Étant donné qu’il n’y a pas le même ensemble strict d’attentes concernant l’apparence ou le style des tableaux, les concepteurs disposent d’une grande marge de manœuvre lorsqu’ils travaillent avec des grilles de données. Évidemment, vous voulez toujours que l’utilisateur puisse utiliser rapidement et facilement les outils de données disponibles… mais au-delà, il y a beaucoup de liberté ! Cela signifie que les grilles de données peuvent souvent être plus fortement stylé afin de se fondre plus naturellement avec l’aspect et la convivialité du reste de votre application.

Lequel dois-je utiliser ?

Commencez par la chose la plus simple qui répondra à l’exigence, et ne passez au composant le plus complexe que lorsque vous savez que vos utilisateurs auront besoin de l’ensemble de fonctionnalités qu’il offre. Donc, dans ce cas, vous pouvez commencer avec un simple tableau. Si vous constatez que vous avez beaucoup de données et que vos utilisateurs bénéficieraient de la pagination, du tri, du filtrage et du regroupement, il est temps de commencer à examiner les grilles de données. Si vous disposez d’une grille de données et constatez que vos utilisateurs doivent effectuer des modifications complexes, exécuter des fonctions et manipuler les données sans quitter votre application React, il est temps de commencer à consulter les feuilles de calcul.

En fin de compte, si vous savez déjà que vous avez besoin de plus que le tableau HTML de base par défaut, je vous recommande d’utiliser une grille de données, à moins que vous ne sachiez avec certitude que vos utilisateurs devront effectuer des modifications complexes ou exécuter des fonctions avancées sur les données. Les feuilles de calcul offrent une pléthore de fonctions, ce qui les rend incroyablement puissantes, mais peut aussi les rendre incroyablement écrasantes si votre utilisateur cherche simplement à examiner les données. En général, c’est une bonne astuce UX de n’offrir que ce dont vos utilisateurs ont besoin, au lieu de compliquer votre interface utilisateur (et votre base de code) avec de nombreux boutons, fonctionnalités et options qui ne seront pas utilisés.

Et n’oubliez pas qu’en tant que développeurs, nous avons tendance à surestimer le pourcentage de « superutilisateurs », alors assurez-vous de valider vos hypothèses sur les besoins de vos utilisateurs en leur parlant directement et en collectant des données d’utilisation. Avec tout cela à l’esprit, vous pourrez choisir l’option qui convient le mieux à votre application React !

Quoi qu’il en soit, l’interface utilisateur de Kendo vous couvre !

Si vous cherchez un puissant, robuste Composant React Data Grid, alors vous ne pouvez pas battre KendoReact ! Écrit à partir de zéro entièrement en React (et TypeScript !), la grille de données KendoReact est incroyablement rapide, hautement personnalisable, 100 % accessible et doté de nombreuses fonctionnalités, y compris (mais sans s’y limiter) pagination, tri/filtration/regroupement,
exportation vers Excel et PDFet mise à jour des données en temps réel.

S’il s’avère que la feuille de calcul est vraiment la meilleure solution pour votre application, Kendo UI peut toujours vous aider ! Bien qu’il n’y ait pas actuellement de composant de feuille de calcul écrit nativement dans React pour KendoReact, il existe une feuille de calcul super puissante disponible dans le cadre du Interface utilisateur de Kendo pour jQuery bibliothèque. La Feuille de calcul de l’interface utilisateur de Kendo offre un large éventail de fonctionnalités utiles, y compris incorporation d’images,
commentant, mise en forme de cellule, fonctions personnalisées, mondialisation et plus!

N’oubliez pas, vous pouvez toujours voir le feuille de route à venir pour les fonctionnalités/composants de KendoReact et Faites le nous savoir
vous aimeriez que nous construisions à l’avenir! Si une feuille de calcul spécifique à KendoReact est importante pour vous, veuillez nous en informer via notre portail de commentaires ! Nous prenons tous les commentaires au sérieux, et ce que nous entendons de votre part joue un rôle énorme dans ce que nous mettons dans notre feuille de route.




Source link