Zola’da arama: fuse.js vs. elasticlunr.js


Zola’nın istemci tarafı araması için fuse.js ve elasticlunr.js karşılaştırılması. Hangi kütüphanenin statik sitenizin ihtiyaçlarına uygun olduğunu öğrenin.

Zola hızlı ve hafif statik bir site jeneratörüdür. İstemci tarafı arama işlevselliğini sunucu olmadan uygulamak için uygun bir JavaScript kitaplığına ihtiyacınız vardır. Zola, arama için sigorta ve elasticlunr’a dayalı dizin formatlarının oluşturulmasını destekleyerek arama özelliklerini uygulamayı kolaylaştırır.

Her ikisi de hafiftir ve bağımlılık olmadan çalışır, ancak Kore dil desteği ve kullanım kolaylığı bakımından farklılık gösterirler. Bu makalede, bu iki kütüphanenin özelliklerini, performansını, Kore desteğini ve neden fuuse.js.’yi seçtiğimi tartışacağım.

Fuse.js ve elasticlunr.js nedir?

ZOLA’da arama işlevselliği eklemek için istemci tarafı bir JavaScript kütüphanesine ihtiyacınız var. Fuse.js ve elasticlunr.js, her biri bulanık arama ve tam metin aramasında güçlü olan popüler seçeneklerdir.

Kütüphane Özellikler Artıları/Eksileri
Fuuse.js Bulanık arama konusunda uzmanlaşmış kütüphane Artıları: Yazım hatalarını veya kısmi maçları ele almada güçlü, hızlı uygulama için basit kurulum
Eksileri: Karmaşık arama özelliklerini desteklemiyor
Elasticlunr.js Tam metin aramasını destekler Artıları: Boolean sorguları, TF/IDF sıralaması gibi gelişmiş özellikler sağlar
Eksileri: Korece arama için ek kurulum gerektirir

Neden bu ikisini karşılaştırın?

Bloglar veya belgeler için arama işlevselliği basit olmalı ancak birden fazla dili iyi desteklemelidir. Her iki kütüphane de çekicidir, çünkü bağımlılıksız çalışırlar ve Zola’nın TERA şablonları ve JavaScript ile kolayca entegre edilebilir. Bununla birlikte, benim için seçimin temel faktörleri Kore arama performansı, kurulum kolaylığı ve Zola’nın basit felsefesi ile ne kadar iyi hizalandığı idi.

  • Özellikler: Gibi anahtarları belirleyerek dizileri veya nesne listelerini kolayca dizinler titlecontent. Arama eşiği veya ağırlıkları ile esnek sorgu ayarlamaları mümkündür.
  • Kore Desteği: Doğal olarak Kore bulanık aramayı ayıran ayrı eklentilerle işler. Örneğin, “Hangul” arayışı “Kore Arama”, “Hangul Arama” gibi sonuçlar bulacaktır.
  • Performans: Küçük ila orta ölçekli veri kümelerinde (yüzlerce ila binlerce belge) hızlı ve hafif çalışır.

örneğin

const fuse = new Fuse(list, { keys: ['title', 'content'], threshold: 0.4 });
const results = fuse.search('한글');

Elasticlunr.js: Gelişmiş arama seçeneği

  • Özellikler: Alana özgü indekslemeyi destekler, kelime özelleştirmesini durdurur, Boolean sorguları, TF/IDF sıralaması. Alana özgü artırma ile kesin arama mümkündür (örneğin, title:검색).
  • Kore Desteği: Varsayılan ayarlar İngilizce merkezlidir, bu nedenle Kore arama performansı zayıftır. Eklemelisin lunr-languages Uygun Kore tokenizasyonu için eklenti.
  • Performans: Büyük veri kümelerinde bile hızlı, ancak tarayıcı belleği ile sınırlıdır ve kurulum nispeten karmaşıktır.

örneğin

const index = elasticlunr();
index.addField('title');
index.addDoc(doc);
const results = index.search('한글', { fields: { title: { boost: 2 } } });

Zola ile nasıl entegre edilir?

Zola, TERA şablonları ve JavaScript ile arama kullanıcı arayüzünün kolay yapılandırılmasına izin verir. Bağlı olarak config.toml Ayarlar, Build sırasında bir JSON Biçim Dizin dosyası oluşturulur, bu da arama işlevselliği eklemek için JavaScript’e yüklenebilir.

Sigorta

Ayarlamak index_format ile fuse_javascript veya fuse_jsonve Build sırasında, Fuse.js tarafından kullanılabilen bir formatta bir dizin dosyası gibi search_index.en.jsonüretilecek.

# config.toml
[search]
index_format = "fuse_javascript" # or "fuse_json"

Elasticlunr

Benzer şekilde, elasticlunr_javascript veya elasticlunr_json Elasticlunr formatında bir dizin dosyası oluşturmak için.

# config.toml
[search]
index_format = "elasticlunr_javascript" # or "elasticlunr_json"

Benim Davam

Daha fazla kilo ekledim title ve dahil body Ve tags Arama hedeflerinde aşağıdaki gibidir. Ayarlayabilirsin threshold Arama hassasiyetini ayarlamak için değer.

var options = {
  keys: [
    { name: "title", weight: 2 },
    { name: "body", weight: 1 },
    { name: "tags", weight: 1 },
  ],
  includeScore: true,
  ignoreLocation: true,
  threshold: 0.4, // Adjust as needed for search sensitivity
};
var currentTerm = "";
var documents = Object.values(window.searchIndex.documentStore.docs);
var fuse = new Fuse(documents, options);

// https://github.com/hahwul/goyo/blob/main/static/goyo.js

Neden FUSE.JS’yi seçtim

Başlangıçta, Zola Kore endekslerini doğrudan desteklemediğinden, sadece İngilizce aramalar için çalışan Elasticlunr kullanıyordum. Ancak, bu yılın Mayıs ayında (2025.05), gönderilen PR birleştirildi ve resmi olarak Kore endeks desteğini sağladı ve yakın zamanda sürümde yer aldı.

Bu beni arama kütüphanelerini yeniden gözden geçirmeye yönlendirdi ve nihayetinde, Zola’nın basit felsefesiyle iyi hizalandığı için fuse.js’ye doğru eğildim. Figuse.js topluluğunun çok daha aktif olması da cazipti. Ayrıca, lunr-language Kore’yi destekler, elasticlunr.js ile entegre etmek çok çaba gerektirir, oysa fuse.js ayrı bir kurulum olmadan hemen kullanılabilir, bu da uygun hale getirir.

Çözüm

Zola’da arama işlevselliği uyguluyorsanız, fuse.js’yi basit ve hızlı bir çözüm olarak öneririm. Özellikle küçük ve orta boyutlu siteler için en uygundur ve Koreli için ek kurulum olmadan esnek bulanık arama sağlar. Elasticlunr.js, gelişmiş arama özelliklerinin gerekli olduğu yerlerde kullanışlıdır, ancak çoğu durumda sigorta yatırım için daha iyi değer sunar.

Her iki kütüphane de mükemmel, ancak deneyimime göre, Fuse.js Zola’nın özü ile daha iyi uyuyor. Bir blog veya belge sayfası çalıştırıyorsanız, umarım çeşitli arama özelliklerini karşılaştırırsınız ve daha iyi bir arama deneyimi oluşturursunuz.



Source link