Wordgard: ProseMirror yaratıcısından tarayıcı için zengin metin editörü

 (wordgard.net)
1 puan yazan GN⁺ 5 시간 전 | 1 yorum | WhatsApp'ta paylaş
  • Wordgard, tarayıcıda zengin metin editörleri oluşturmak için kullanılan açık kaynaklı bir JavaScript kütüphanesidir ve ProseMirror’un yaratıcısının geliştirdiği yeni bir editör temelini kullanır
  • Serbest biçimli HTML editörlerinden ziyade belge yapısını denetlemeye odaklanır; geliştiricilerin izin verilecek içerik türlerini ve anlamsal yapıyı hassas biçimde tanımlamasına olanak tanır
  • Karmaşık özelleştirilmiş editörleri hedefleyerek şema tabanlı model ve eklenti merkezli bir yapı sunar; özellikler ihtiyaca göre değiştirilebilir veya düzenlenebilir
  • Erişilebilirlik, uluslararasılaştırma, RTL·çift yönlü belgeler, yapılandırılmış içerik, işlevsel stil ve işbirlikçi düzenleme gibi gereksinimleri editör temelinde ele alır
  • MIT lisanslı, izin verici bir açık kaynak projesidir; ancak hata raporlarını memnuniyetle kabul ederken Pull request kabul etmeyen bir çalışma modelini benimser

Belge yapısını denetleyen editör temeli

  • Wordgard, tarayıcı içinde zengin metin editörleri geliştirmek için kullanılan açık kaynaklı bir JavaScript kütüphanesidir
  • Serbest biçimli bir HTML editörü değil, geliştiricilerin destekleyeceği içerik türlerini ve belge yapısını tam olarak kontrol etmesini sağlayan anlamsal zengin metin editörü sistemidir
  • Belge yapısını ayrıntılı biçimde tanımlamak ve özel belge öğeleri oluşturmak için şema tabanlı bir yaklaşım sunar
  • Programlama arayüzü genel kullanım ve esneklik hedefiyle tasarlanmıştır; bu yüzden gereksinimleri yüksek özelleştirilmiş editörler için temel olarak kullanılabilir

Genişletilebilirlik, erişilebilirlik ve işbirliği özellikleri

  • Editörün işlevlerinin çoğu eklenti (extension) olarak uygulanır; bu sayede ihtiyaçlara uymayan parçalar değiştirilebilir veya düzenlenebilir
  • Erişilebilirlik özellikleri; ekran okuyucu kullananları, yalnızca klavyeyle çalışan kullanıcıları ve mobil cihaz ortamlarını dikkate alır, ayrıca arayüz uluslararasılaştırmasını da destekler
  • Sağdan sola yazılan ortamlar için hem içerikte hem arayüzde yön farkındalığı sunar; çift yönlü içerik ve RTL belgeleri işleyebilir
  • Belge ağacı; tablolar, iç içe listeler, açıklamalı figure öğeleri ve özel yapılar gibi yapılandırılmış içerikleri içerebilir
  • Sistemin büyük bir bölümü, açıklık ve test edilebilirlik için işlevsel bir tarzda yazılmıştır
  • Birden fazla kullanıcının aynı belgeyi eşzamanlı olarak düzenlemesini ve eşzamanlı değişikliklerin birleştirilmesini sağlayan işbirlikçi düzenleme desteği sunar

Lisans ve proje yönetimi

İlgili okumalar

1 yorum

 
GN⁺ 5 시간 전
Hacker News yorumları

  • Çoğu kişinin “neden?” sorusunun yanıtını merak edeceğini düşünüyorum. Bu belge ProseMirror ile farkları ele aldığı için o soruya en yakın yanıttı: https://wordgard.net/docs/prosemirror/
    Dikkat çekici bir nokta, yükseltme yolu olmaması. ProseMirror ile paylaştığı birçok kavram var, ancak geçiş yapmak epey iş gerektiriyor gibi görünüyor. Obsidian CodeMirror tabanlı olduğu için değiştirmez gibi, ama tiptap.dev gibi yerler etkilenebilir
    @merijn, Wordgard’ın geçiş maliyetine değecek kadar değerli olmasının nedenini açıklayıp açıklayamayacağını merak ediyorum
    Düzenleme: Marijn’in kişisel blogunda birçok konunun ele alındığını gördüm ve daha iyi bağlam için https://marijnhaverbeke.nl/blog/wordgard-0.1.html adresini HN’ye gönderdim

    • “Wordgard geçiş maliyetine değer mi?” konusunda, belki de değmez. ProseMirror’dan memnunsanız ProseMirror kullanmaya devam edebilirsiniz; ben de desteklemeyi sürdüreceğim
      Ancak blog yazısında açıkladığım gibi, ProseMirror’da karşılaştığım bazı sorunlardan kaçınmayı sağlayan epey yeni tasarım içgörüsü birikti; bu yüzden yeni bir yineleme yapmak istedim
      Web sitesinin dokümantasyon bölümüne blog yazısının bağlantısını ekleyeceğim
      Ayrıca adım merijn değil, marijn
    • Blogda “Artık ProseMirror kelime oyununu da pek sevmiyorum. CodeMirror ama düzyazı için, anladınız değil mi?” deniyor; o hâlde şimdi birinin Codegard yapma sırası gelmiş gibi
    • Asıl merak edilen soru “geçiş maliyetine neden değer?” Daha da önemlisi, neden bunu sadece ProseMirror v2 olarak yapmadığı da merak konusu
      Açılış sayfasında “ne”den çok “neden” hakkında daha fazla bilgiye ihtiyaç var gibi görünüyor

  • Editörden bağımsız olarak, tasarımı yapan sanatçı gerçekten etkileyici. Çok rafine ve hemen göze çarpıyor: https://kamilastankiewicz.com/

    • Aynı fikirdeyim. Gerçekten güzel; mevcut bir web sitesine böyle illüstrasyonlar ekletmenin maliyeti ne olur merak ediyorum
    • Grafikler şaşırtıcı derecede iyi ve Ghibli havası da var. Zengin metin editörü bağlamında bunu söylüyor olmak tuhaf

  • Yaklaşık 25 yıl önce okul gazetesi için bir PHP-Nuke sitesi ayağa kaldırırken WYSIWYG editörü çalıştırmanın büyük bir engel olduğunu ve sonunda bunu aştığımızı hatırlıyorum
    Böyle bir özellik için 15 yıl önce çoktan kabul edilmiş bir web standardı uygulamasının hâlâ olmaması akıl alır gibi değil

    • contenteditable var; Wordgard ya da ProseMirror gibi şeyler de temelde onun üzerine inşa ediliyor. Geri kalanı daha çok kullanıcı arayüzü ve rastgele HTML girdisi istemeyen sistemlerle birlikte çalışabilirlik meselesi
    • Tarayıcı üreticileri uzun süre basit metin seçimi davranışının ayrıntılarında bile uzlaşamadı

  • Bu şaşırtıcı derecede harika görünüyor
    Yakın zamanda benzer bir şey arıyordum, sonunda kendim yaptım; blok tabanlı operasyonel dönüşüm (OT) ile yerel sunucuya eşitledim ve uzak sunucu için fark tabanlı senkronizasyon ekledim
    Sistem rehberini okurken sürekli başımı sallıyorum. Benzer ve zıt noktaları görmek epey doğrulanmış hissettiriyor

    • ProseMirror, muhtemelen Wordgard da öyle, gerçekten pek çok şeyi doğru yapıyor

  • Tüm editörlerin başarısız olduğu çok temel bir alan var: iPhone ile editörün içinde tam bir cümle yazıp yazamadığınız
    Wordgard bu testi geçemedi. Otomatik düzeltmeden veya klavye önerilerinden gelen giriş yutuluyor; kısmen yazılmış ya da yanlış yazılmış kelimeler siliniyor

    • ProseMirror ve kardeş yorumda bahsedilen Lexical de bu kısmı iyi işleyebilmeliydi
      Mobil Safari ve Android Chrome, masaüstü kardeş tarayıcılarından farklı olarak gerçekten çok sayıda garip davranış sergiliyor ve standartları da epey gevşek yorumluyor. Bu yüzden düzgün çalışması için çoğu zaman uzun kuyruklu geçici çözüm kodları gerekiyor
      Wordgard da sonunda oraya varacaktır; ancak ilk sürüme kadar odak mimariydi
    • Birkaç yıl önce web tabanlı zengin metin editörlerini incelemiştim. Masaüstünde hepsi iyi görünüyordu ama mobilde denediğim her şey berbattı
      Seçim yapılamıyor, otomatik düzeltme bozuluyor, metne dokununca imleç hareket etmiyor, giriş duruyor, öğe odağı kaybetse bile klavye kaybolmuyordu
      Son on yıllarda web’e düzgün bir zengin metin öğesi eklemeye yönelik birçok girişim oldu ama hepsinin neden başarısız olduğunu bilmiyorum. Büyük, karmaşık ve karşılığı az olan bir iş olduğu için gibi görünüyor
      Düzgün yerel zengin metin desteği, web’in büyük kör noktalarından biri. Yerel platformlar bu sorunu onlarca yıl önce çözdü

  • Yaklaşık 6 yıl önce @ tarzı uzak kaynak otomatik tamamlama, yani başka kullanıcıları veya belgeleri referanslama özelliğini araştırıp uygularken çok zorlanmıştım. Bu editörün genişletme biçimi ProseMirror’ın evrimleşmiş hâli gibi görünüyor
    Bunun dinozor örneğine dayanarak kendinizin yapmak zorunda kaldığı bir şey değil, varsayılan yerleşik özellik olması gerçekten harika olurdu. Böyle metin editörü kütüphanelerini her kullandığımda bir numaralı kullanım senaryosu bu, sonraki de WYSIWYG

    • @ mention tarzı varsayılan olarak sunulup sadece API verilse harika olurdu
      Birinci sınıf mobil desteği de aynı şekilde gerekli

  • ProseMirror’ı TipTap ile kullanırken zorlandığım nokta, verileri çıkarmak için belgenin JSON temsilini programatik olarak işlemenin çok sık gerekmesiydi. Bunun için statik tipli bir temsil gerekiyor ya da en azından bunu güçlü biçimde tercih ediyorsunuz
    ProseMirror’da bunun için pek bir mekanizma yok; sonuçta şu ikisinden birini yapıyorduk

    1. Şemayı iki kez tanımlamak. Bir kez ProseMirror ile, bir kez de Zod gibi bir şeyle tanımlayıp iki şemanın eşleştiğini doğrulayan bir sürü eşitlik testi koymak
    2. ProseMirror şeması üretebilen bir meta şema tanım katmanı oluşturmak, ama bunu standart şema spesifikasyonuna https://standardschema.dev/ uydurmak. Bu yaklaşım, Tiptap gibi bir şey kullanmadığınızda daha pratik
      Wordgard’ı henüz denemedim, bu sorunu ele alıyor mu bilmiyorum; ama çözülürse iyi olacak bir acı noktası olarak not düşüyorum

  • Web sitesindeki sanat çalışmaları çok güzel. Dikkat çekmenin bu yolu sanki yeniden unutulmuştu da hatırlanmış gibi hissettiriyor

    • “%0 yapay zeka içeriyor” da denebilir. Bu sanatçı gerçekten harika
    • Her yerin yapay zeka çöplüğüyle dolduğu bir ortamda elle çizilmiş güzel illüstrasyonlar görmek gerçekten ferahlatıcı

  • Web’de WYSIWYG’i sevmiyorum. Forum yazısını uzun uzun, sıkıcı biçimde biçimlendiriyorsunuz; sekmeyi kapatınca hepsi yok oluyor
    Yerel bir metin editörü kullanıp web formuna Ctrl+V ile yapıştırmayı tercih ederim. Markdown ise bunu yapabilirsiniz

    • Bazı platformların bunu localStorage ile çözdüğünü gördüm. Yazarken “taslağı” otomatik kaydediyor ve sayfayı yeniden açtığınızda doğal biçimde geri yüklüyor
      Sekmeyi yanlışlıkla kapattıktan sonra bunu ilk yaşadığımda gerçekten hoş bir sürpriz olmuştu
    • Linear’a bakın. Bağlantım yok ama daha dün yanlışlıkla bir iletişim kutusunu kapattım; tekrar issue oluştur’a tıkladığımda yazdığım uzun metin olduğu gibi duruyordu
      Mesele şu: bu bir teknoloji sorunu değil, ürün sorunu
    • Duruma bağlı. Blogumda web tabanlı bir editör var ama sadece Markdown kullanıp önizleme ekleyen bir yapı; anlattığınız iş akışına benziyor
      Not uygulamamda WYSIWYG kullanmaya karar verdim, çünkü bölünmüş görünüm için yer yoktu ve sadece Markdown kaynağını görmek de istemiyordum
      WYSIWYG ile ilgili en büyük şikâyetim engelleyici olabilmesi. Örneğin verbatim blok oluşturuyorsunuz ve bazen o bloktan çıkamıyorsunuz. Teams’e bakarak söylüyorum. Sanırım LaTeX’i bu yüzden bu kadar sevmiş de olabilirim
    • ProseMirror ve diğer editörler için zaten iyi backend’ler var. Kurması zor değil
    • Katılıyorum ama birçok kişi WYSIWYG’i tercih ediyor. Basitçe, çeşitli HTML editörleri veya Markdown editörlerinde olduğu gibi yan yana görünüm sunulabilir

  • Uzun zamandır ilk kez gerçek sanat görmekten gerçekten mutluyum. Hoş görünüyor