brief: | i18n.site хәзер серверсыз тулы текст эзләүгә ярдәм итә.

Бу мәкалә саф фронтның тулы текст эзләү технологиясен кертү белән таныштыра, шул исәптән IndexedDB төзегән инверсия индекс, префикс эзләү, сүз сегментлаштыру оптимизациясе һәм күп телле ярдәм.

Мөмкин булган чишелешләр белән чагыштырганда, i18n.site чиста фронтның тулы текстлы эзләнеше кечкенә һәм тиз, документлар һәм блоглар кебек кечкенә һәм урта вебсайтлар өчен яраклы, һәм оффлайнда бар.


Чиста Фронтның Тулы Текст Эзләү

Эзлеклелеге

& атна үсештән markdown i18n.site

Бу мәкалә эзләү эффектын татып карау өчен i18n.site саф фронтның техник кулланылышын бүлешәчәк i18n.site

Код ачык : эзләү / интерактив интерфейс

Серверсыз Тулы Текст Эзләү Карарларына Күзәтү

Документлар / шәхси блоглар кебек кечкенә һәм урта размерлы статик вебсайтлар өчен, үзеннән-үзе төзелгән тулы текст эзләү аркасын төзү бик авыр, һәм хезмәтсез тулы текст эзләү - киң таралган сайлау.

Серверсыз тулы текст эзләү чишелешләре ике киң категориягә бүленә:

Беренчедән, algolia.com Өченче як эзләү хезмәте күрсәтүчеләр тулы текст эзләү өчен фронтовик компонентлар белән тәэмин итәләр!

Мондый хезмәтләр эзләү күләменә карап түләү таләп итә, һәм веб-сайтка туры килү кебек проблемалар аркасында Кытай материкларында кулланучылар өчен еш булмый.

Аны оффлайнда кулланып булмый, интернетта кулланып булмый, зур чикләүләре бар. Бу мәкаләдә күп сөйләшелми.

Икенчесе - тулы текст эзләү.

Хәзерге вакытта тулы саф фронт эзләүләре һәм ElasticLunr.js ( lunrjs икенчел үсеш нигезендә) lunrjs

lunrjs Индекслар төзүнең ике ысулы бар, һәм икесенең дә үз проблемалары бар.

  1. Алдан төзелгән индекс файллары

    Индекста барлык документлардан сүзләр булганлыктан, зурлыгы зур. Документ өстәлгәндә яки үзгәртелгәндә, яңа индекс файл йөкләнергә тиеш. Бу кулланучының көтү вакытын арттырачак һәм күп полоса киңлеген кулланачак.

  2. Документларны йөкләгез һәм очышта индекслар төзегез

    Индекс төзү - исәпләү интенсив бурычы, индекска кергән саен яңадан торгызу ачык артта калуга һәм начар куллану тәҗрибәсенә китерәчәк.


lunrjs -га өстәп, башка тулы текст эзләү карарлары бар, мәсәлән :

эзләү өчен тезмәләр арасындагы охшашлыкны исәпләгез fusejs

Бу чишелешнең эшләнеше бик начар, аны тулы текст эзләү өчен кулланып булмый (карагыз Fuse.js Озын сорау 10 секундтан артык вакыт ала, аны ничек оптимальләштерергә? ).

Эзләү өчен Блум фильтрын кулланыгыз TinySearch префикс эзләү өчен кулланып булмый (мәсәлән, goo кертегез, good , google эзләгез), һәм шундый ук автоматик тәмамлау эффектына ирешә алмыйсыз.

Мөмкин булган чишелешләрнең җитешсезлекләре аркасында, i18n.site түбәндәге характеристикаларга ия булган яңа саф фронтның тулы текст эзләү чишелешен эшләде :

  1. Күп телле эзләүне хуплый һәм зурлыгы gzip булганнан соң эзләү үзәгенең зурлыгы 6.9KB (чагыштыру өчен, lunrjs зурлыгы 25KB ).
  2. indexedb нигезендә инверсия индекс төзегез, ул хәтерне азрак ала һәм тиз.
  3. Документлар өстәлгәндә / үзгәртелгәч, өстәмә яки үзгәртелгән документлар гына яңадан индексацияләнә, исәпләү күләмен киметә.
  4. Префикс эзләүне хуплый һәм кулланучы язган вакытта эзләү нәтиҗәләрен күрсәтә ала.
  5. Оффлайнда бар

Түбәндә i18n.site техник тормышка ашыру детальләре җентекләп кертеләчәк.

Күп Телле Сүз Сегментациясе

Сүз сегментациясе браузерның туган сүз сегментациясен куллана Intl.Segmenter һәм барлык төп браузерлар бу интерфейсны хуплый.

Сегментлаштыру coffeescript коды сүзе түбәндәгечә

SEG = new Intl.Segmenter 0, granularity: "word"

seg = (txt) =>
  r = []
  for {segment} from SEG.segment(txt)
    for i from segment.split('.')
      i = i.trim()
      if i and !'| `'.includes(i) and !/\p{P}/u.test(i)
        r.push i
  r

export default seg

export segqy = (q) =>
  seg q.toLocaleLowerCase()

эчендә:

Индекс Төзелеше

5 объект саклау таблицасы IndexedDB ясалган :

url документлар массивына һәм ver версиягә керегез, һәм документның doc таблицада барлыгын тикшерегез. Әгәр дә ул юк икән, кире индекс булдырыгыз. Шул ук вакытта, тапшырылмаган документлар өчен кире индексны бетерегез.

Шул рәвешле, арту индексациясенә ирешеп була һәм исәпләү күләме кими.

Фронтовик үзара бәйләнештә, индексның йөкләү прогрессы беренче тапкыр йөкләнгәндә артта калу / күрсәтелергә мөмкин. Карагыз " css белән прогресс сызыгы progress +

IndexedDB Югары Берьюлы Язу

Проект асинхрон анкапсуляция нигезендә idb IndexedDB

IndexedDB укый һәм яза асинхрон. Индекс ясаганда, индекс ясау өчен документлар бер үк вакытта йөкләнәчәк.

Конкуренцияле язу аркасында килеп чыккан өлешчә мәгълүмат югалтудан саклану өчен, сез түбәндәге coffeescript кодка мөрәҗәгать итә аласыз һәм конкурент язуларны туктату өчен уку һәм язу арасында ing кэш өсти аласыз.

pusher = =>
  ing = new Map()
  (table, id, val)=>
    id_set = ing.get(id)
    if id_set
      id_set.add val
      return

    id_set = new Set([val])
    ing.set id, id_set
    pre = await table.get(id)
    li = pre?.li or []

    loop
      to_add = [...id_set]
      li.push(...to_add)
      await table.put({id,li})
      for i from to_add
        id_set.delete i
      if not id_set.size
        ing.delete id
        break
    return

rindexPush = pusher()
prefixPush = pusher()

Төгәллек Һәм Искә Төшерү

Эзләү башта кулланучы керткән төп сүзләрне сегментлаячак.

Сегментлаштыру сүзеннән соң N сүз бар дип уйлагыз, нәтиҗәләр кайткач, барлык ачкыч сүзләрне үз эченә алган нәтиҗәләр кире кайтарылачак, аннары N-1 , N-2 , ..., 1 ачкыч сүз булган нәтиҗәләр кире кайтарылачак.

Башта күрсәтелгән эзләү нәтиҗәләре сорау төгәллеген тәэмин итә, һәм соңрак йөкләнгән нәтиҗәләр (йөкләү төймәсенә басыгыз) кире кайтару тизлеген тәэмин итә.

Таләп Буенча Йөк

Speedавап тизлеген яхшырту өчен, эзләү yield генераторны таләп буенча йөкләү өчен куллана, һәм нәтиҗә соралган limit кайта.

Игътибар итегез, yield дан соң кабат эзләгән саен, IndexedDB сорау транзакциясен ачарга кирәк.

Префикс Реаль Вакытта Эзләү

Кулланучы язган вакытта эзләү нәтиҗәләрен күрсәтү өчен, мәсәлән, wor кертелгәч, words һәм work кебек wor белән кушылган сүзләр күрсәтелә.

Эзләү үзәге сүз таблицасыннан соң соңгы сүз өчен prefix таблицасын кулланачак, аның белән кушылган барлык сүзләрне табу һәм эзлеклелектә эзләү.

Анти-селкенү debounce шулай ук фронтовик үзара бәйләнештә кулланыла (түбәндәгечә тормышка ашырыла), эзләү эзләү ешлыгын киметү һәм исәпләү күләмен киметү өчен.

export default (wait, func) => {
  var timeout;
  return function(...args) {
    clearTimeout(timeout);
    timeout = setTimeout(func.bind(this, ...args), wait);
  };
}

Оффлайнда Бар

Индекс таблицасы оригиналь текстны сакламый, саклау күләмен киметүче сүзләр генә.

Эзләү нәтиҗәләрен яктырту оригиналь текстны яңадан йөкләүне таләп итә, һәм service worker туры килү челтәр таләпләреннән сакланырга мөмкин.

Шул ук вакытта, барлык мәкаләләрне service worker кэшлаганга, кулланучы эзләүне башкарганнан соң, бөтен сайт, шул исәптән эзләү, оффлайнда була.

MarkDown Документларын Оптимизацияләү

i18n.site 'чиста фронт эзләү чишелеше MarkDown документ өчен оптимальләштерелгән.

Эзләү нәтиҗәләрен күрсәткәндә бүлек исеме күрсәтеләчәк һәм бүлек басылганда юнәлтеләчәк.

Йомгаклау

Кире тулы текстлы эзләү алгы очында гына башкарылды, сервер кирәк түгел. Бу документлар һәм шәхси блоглар кебек кечкенә һәм урта вебсайтлар өчен бик яраклы.

i18n.site Ачык чыганак үзеннән-үзе эшләнгән саф фронт эзләү, зурлыгы кечкенә һәм тиз җавап, хәзерге саф фронтның тулы текст эзләү җитешсезлекләрен чишә һәм кулланучыларга яхшырак тәҗрибә бирә.