Sortie de l’éditeur de texte enrichi Quill v2

 (quilljs.com)
2 points par GN⁺ 2024-04-20 | 1 commentaires | Partager sur WhatsApp
  • Quill 2.0 est un éditeur WYSIWYG gratuit et open source utilisable sur le Web moderne, permettant d’intégrer directement des fonctionnalités d’édition de texte enrichi dans un produit
  • Grâce à une architecture modulaire et à une API expressive, il permet de partir du cœur de base puis de personnaliser l’éditeur selon les besoins
  • Les développeurs peuvent accéder finement au contenu, aux modifications et aux événements de l’éditeur, et compter sur un comportement cohérent grâce à l’utilisation de JSON en entrée comme en sortie
  • Il prend en charge les navigateurs modernes sur ordinateurs, tablettes et téléphones, avec pour objectif d’offrir le même comportement et le même HTML généré sur l’ensemble des plateformes
  • Son champ d’application peut s’étendre des petits projets aux entreprises du Fortune 500, ce qui en fait un bon choix pour adopter un éditeur simple puis l’étendre à mesure que le produit grandit

Quill 2.0 et prise en main

  • Quill 2.0 est sorti, et les détails de la version sont disponibles dans un article d’annonce séparé : Quill 2.0 is released!
  • Quill est un éditeur WYSIWYG gratuit et open source conçu pour le Web moderne
  • L’exemple de base charge quill.snow.css et quill.js depuis un CDN, puis crée l’éditeur avec new Quill('#editor', ...)
    • La version de l’exemple est quill@2.0.3
    • #toolbar est indiqué dans modules.toolbar et le theme utilisé est snow
  • Il est possible de tester directement l’API dans la console développeur du navigateur

Personnalisation et champ d’application

  • Quill permet d’adapter l’éditeur aux besoins grâce à son architecture modulaire et à son API
  • Les développeurs peuvent accéder finement au contenu, aux modifications et aux événements de l’éditeur via une API simple
  • Il utilise JSON en entrée comme en sortie afin de fournir un comportement cohérent et déterministe
  • Il prend en charge les navigateurs modernes sur ordinateurs, tablettes et téléphones, et fournit le même comportement ainsi que le même HTML généré entre les plateformes
  • Il peut être utilisé aussi bien dans de petits projets que dans des entreprises du Fortune 500 ; on peut commencer avec le cœur de Quill, puis le personnaliser ou ajouter des extensions selon les besoins
  • Le nombre de GitHub Stars affiché est de 47 204

À lire aussi

1 commentaires

 
GN⁺ 2024-04-20
Avis sur Hacker News

  • Dans mon précédent travail, j’avais mis en place un système où les utilisateurs saisissaient du texte enrichi dans une zone de texte Quill, puis où celui-ci était stocké dans la base de données au format Delta
    Plus tard, un autre membre de l’équipe importait ce contenu dans un plugin InDesign, lisait la mise en forme appliquée dans Quill et la réappliquait sous forme de styles côté InDesign
    Le flux consistait à faire saisir les annonces légales du journal par le personnel de bureau, puis à transmettre le travail à l’équipe de production pour l’impression via InDesign, et le format Quill Delta a énormément simplifié une tâche qui aurait été bien plus difficile si, comme la plupart des éditeurs, nous avions stocké du HTML
    Je n’avais ni entendu parler ni utilisé Quill depuis des années, donc ça fait plaisir de voir que le projet est toujours vivant

  • Notes de version : https://github.com/quilljs/quill/releases/tag/v2.0.0
    Billet d’annonce : https://slab.com/blog/announcing-quill-2-0/
    J’ai pas mal utilisé Quill : l’intégration est facile, le format JSON Delta est plutôt correct, et la structure est assez simple
    Cela dit, à chaque fois, je me demande : « est-ce qu’il ne vaudrait pas mieux utiliser ProseMirror ? »
    Quill est une bonne solution provisoire quand on a besoin rapidement de fonctionnalités d’édition, mais dès que les exigences autour de ces fonctions grossissent, je me retrouve toujours à calculer mentalement qu’il faudra un jour prévoir un plan de migration

    • Ce serait bien de pouvoir remplacer le lien de soumission par [1], puisque le sujet porte en réalité sur la nouvelle version
      D’un autre côté, je me demande parfois pourquoi il est impossible de standardiser les éditeurs de texte enrichi
      [1] https://slab.com/blog/announcing-quill-2-0/
    • Je suis en train de regarder ProseMirror, surtout via tiptap2, qui semble bien l’envelopper
      Mais le passage effectif me paraît lourd, et je serais curieux d’avoir le retour d’expérience d’autres personnes
    • Je devais implémenter l’édition de texte enrichi au travail, j’ai donc étudié plusieurs options, et Quill faisait partie des premiers candidats que j’ai examinés, mais j’ai finalement choisi ProseMirror
      Je l’ai choisi pour son niveau très bas et l’ampleur de sa documentation ; ça m’a un peu rappelé D3
      Depuis, j’ai créé des nœuds personnalisés, des commandes personnalisées, une barre d’outils personnalisée, je l’ai intégré à Markdown ainsi qu’à des plugins Markdown maison, et avec juste un peu de code de liaison il s’intègre aussi assez proprement avec Vue
      Jusqu’ici, je suis très satisfait d’avoir choisi ProseMirror

  • Je ne sais pas si c’est bizarre d’avoir des opinions aussi tranchées sur la manière dont la touche Return devrait être gérée dans un éditeur de texte
    En texte brut, Return doit insérer une nouvelle ligne, et en texte enrichi, Return doit créer un nouveau paragraphe
    Si on veut un simple saut de ligne, on peut utiliser Shift+Return
    Dans les anciennes versions, c’était un gros problème, et je ne sais pas jusqu’où ce comportement est personnalisable aujourd’hui
    Je reconnais que je me focalise peut-être trop là-dessus, mais TipTap me convenait bien

    • La configuration devrait être simple, mais je ne pense pas que ce comportement doive être la valeur par défaut
      Parce qu’il est moins courant et ne s’applique qu’à certains types de blocs quand on appuie sur Return
      Shift+Return n’est pas non plus utilisable sur mobile, et devoir connaître une combinaison de touches cachée pour obtenir le comportement voulu est agaçant
      L’éditeur enrichi de Reddit fonctionne comme ça, et je me bats souvent avec lui
      Au fond, il s’agit juste d’éviter à l’utilisateur d’avoir à appuyer deux fois sur Return
      Je comprends l’élégance de garder l’utilisateur en permanence dans un paragraphe et de réserver Shift+Return à un saut de ligne explicite, mais dans un domaine aussi capricieux que les éditeurs de texte enrichi, je ferais passer l’expérience utilisateur avant l’élégance
    • Tout à fait d’accord. Même la prise en charge de Shift+ me paraît fragile, même si je pourrais sans doute faire cette concession
      La gestion des paragraphes dans les exemples Quill a l’air maladroite
    • Si j’ai bien compris, cela ressemble au comportement des champs de saisie de texte de Confluence/JIRA

  • La documentation est excellente. J’aimerais que tous les projets open source aient une page comme « Why Quill »[1], parce que cela permet de comprendre rapidement la philosophie du projet et de voir si elle correspond à mes objectifs
    Mieux encore, il pourrait aussi y avoir un contenu du type « Why Not Quill », pour savoir rapidement dans quels cas le projet n’est pas adapté
    Tous les projets impliquent des compromis, donc les présenter de manière directe et claire offre une meilleure expérience aux utilisateurs
    [1] https://quilljs.com/docs/why-quill

  • Ce n’est pas évident en regardant seulement le lien, mais Quill v2 a sans doute été publiée il y a 3 jours, ce qui explique probablement ce post
    J’ai travaillé sur Quill v1 jusqu’à récemment, et ce n’était pas terrible
    Faire fonctionner les tableaux via un plugin était pénible, et il y avait aussi d’étranges problèmes de défilement
    J’espère que la v2 a corrigé beaucoup de choses, mais je compte continuer à utiliser TinyMCE, meilleur sur le plan fonctionnel

    • J’aime aussi TinyMCE, au point d’avoir remplacé l’éditeur Quill par TinyMCE il y a 6 mois
      Mais le fait qu’une clé API soit nécessaire même pour servir du JS statique sur un site m’a agacé, et j’ai aussi été embêté par la diminution rapide de l’« utilisation » de rendu d’éditeur dans l’offre gratuite il y a quelques jours [0]
      Je me demande si cela ne pose pas problème
      [0] https://news.ycombinator.com/item?id=40044544

  • Au début, je ne comprenais pas pourquoi Quill remontait à nouveau, mais je viens de réaliser que la version 2.0, attendue depuis longtemps, est sortie il y a 3 jours
    Voir https://slab.com/blog/announcing-quill-2-0/

    • Je pense que ce lien et ce titre constituent un meilleur point d’entrée pour le sujet

  • Il m’est déjà arrivé d’être sérieusement pénalisé sur un ancien projet à cause de l’usage de Quill
    Personnellement, le vrai problème venait du fait de ne pas avoir suffisamment examiné les limites de l’éditeur par rapport aux exigences du projet, mais la manière dont la documentation met l’accent sur l’extensibilité de la bibliothèque pouvait aussi induire en erreur
    Tant qu’on reste dans ses limites, c’est une excellente bibliothèque. Par exemple, mieux vaut éviter des choses trop complexes comme du contenu imbriqué
    Il serait assez utile d’avoir sur le site une section du genre « Why You Should NOT Use Quill? »

  • Cela dépend sans doute des cas, mais pour ma part, je ne pense jamais réutiliser Quill dans un projet de production
    J’ai commencé à utiliser Quill 1.x vers 2016 et, au début, il me plaisait beaucoup
    Quand j’ai tweeté que j’étais en train d’évaluer Quill, Jason m’a contacté en premier et m’a aidé sur des questions liées à l’implémentation
    En 2019, je rencontrais quelques bugs, Quill 1.x était en mode maintenance, et la 2.0 n’avait pratiquement pas de documentation [1]
    J’ai contacté Jason sur Twitter pour essayer d’avoir une idée du calendrier [2], mais j’ai reçu en gros une réponse me disant d’aller me faire voir
    Son entreprise, Slab, m’a aussi bloqué sur Twitter depuis, même si c’était peut-être destiné à mon compte personnel
    Quand on construit une startup, on a tous des journées stressantes, donc j’ai peut-être simplement choisi un mauvais moment pour le contacter
    J’imagine qu’il se concentrait sur son entreprise et qu’il avait tout juste le temps de maintenir Quill pour son usage interne, sans vraiment avoir de marge pour le publier comme open source. Si c’était le cas, j’aurais préféré qu’il le dise franchement
    Cinq ans plus tard, Quill v2 est enfin sorti, et je suis content de voir que Slab existe toujours
    J’espère qu’ils auront désormais les moyens de maintenir Quill publiquement, mais si vous comptez l’utiliser en production, il faut vérifier quel est le niveau d’engagement sur le support et prévoir aussi un plan si les réponses s’arrêtent
    Si Jason lit ce fil, je n’ai aucune rancune, c’est de l’histoire ancienne. Il peut ignorer ça ou ajouter son point de vue
    [1] https://github.com/quilljs/quill/issues/2435
    [2] https://twitter.com/nickbaum/status/1177240103925796865

    • Je n’ai pas eu d’expérience liée à Jason, mais j’ai passé beaucoup trop de temps à lire le code de Quill pour bricoler des correctifs de contournement à des comportements bizarres
      C’est d’autant plus frustrant que si on utilise une bibliothèque d’éditeur de texte enrichi au lieu de le faire soi-même, c’est précisément pour éviter ce genre de choses
      Je ne sais pas pour la v2, mais le code de la v1 n’est pas particulièrement bien structuré
      Certaines fonctionnalités de base ont aussi été repoussées parce qu’on craignait de déclencher un million de petits bugs
      De loin, ce qu’il y a de mieux dans Quill, c’est le format Delta
      Mais pour ceux qui veulent autre chose que du gras/souligné/italique, je recommanderais ProseMirror

  • Articles liés. Y en a-t-il d’autres ?
    Announcing Quill 1.0 - https://news.ycombinator.com/item?id=12437345 - septembre 2016, 82 commentaires
    Quill – A cross browser rich text editor with an API - https://news.ycombinator.com/item?id=10446865 - octobre 2015, 47 commentaires
    Quill – An Open Source Rich Text Editor with an API - https://news.ycombinator.com/item?id=7716376 - mai 2014, 60 commentaires

    • Cette annonce concerne la version 2, qui semble avoir été publiée il y a quelques jours

  • Je me souviens avoir utilisé https://github.com/facebook/lexical sur un projet il y a environ un an, et dans l’ensemble ça fonctionnait bien immédiatement
    Y a-t-il une raison de préférer davantage Quill ?