SQLite Wasm في المتصفّح المتوافق مع Origin Private File System

استخدم SQLite لتلبية جميع احتياجات سعة التخزين لديك بشكل فعّال على الويب.

Thomas Steiner

لمحة عن SQLite

تُعد SQLite لغة شائعة مفتوح المصدر، خفيف، علائقي مضمَّن نظام إدارة قواعد البيانات. يستخدمه العديد من المطورين لتخزين البيانات في بطريقة منظمة وسهلة الاستخدام. بسبب حجمه الصغير وذاكرته المنخفضة الأساسية، غالبًا ما يتم الاستفادة من SQLite كمحرك قاعدة بيانات في الأجهزة المحمولة، وتطبيقات سطح المكتب ومتصفحات الويب.

تتمثل إحدى الميزات الرئيسية لـ SQLite في أنها قاعدة بيانات بدون خادم، والتي يعني أنه لا يتطلب عملية خادم منفصلة للعمل. بدلاً من ذلك، قاعدة البيانات في ملف واحد على جهاز المستخدم، مما يسهل والدمج في التطبيقات.

SQLite على أساس Web Assembly

هناك عدد من إصدارات SQLite غير الرسمية التي تستند إلى Web Assembly (Wasm)، مما يتيح استخدامها في متصفحات الويب، على سبيل المثال، sql.js. تشير رسالة الأشكال البيانية المشروع الفرعي sqlite3 WASM/JS هو والجهد الأول المرتبط رسميًا مشروع SQLite لإنشاء إصدارات Wasm للمكتبة الأعضاء المعينين في عائلة مخرجات SQLite المعتمدة. الخرسانة من أهداف هذا المشروع ما يلي:

• ربط واجهة برمجة تطبيقات sqlite3 منخفضة المستوى أقرب ما يكون ممكنًا في بنود الاستخدام.
• تتميّز واجهة برمجة التطبيقات المهيأة للكائنات ذات المستوى الأعلى، sql.js و عمليات تنفيذ نمط Node.js، والتي مباشرةً إلى واجهة برمجة التطبيقات منخفضة المستوى. يجب استخدام واجهة برمجة التطبيقات هذه من باعتبارها واجهة برمجة التطبيقات منخفضة المستوى.
• واجهة برمجة تطبيقات تستند إلى العمال وتتعامل مع واجهات برمجة التطبيقات السابقة عبر رسائل العامل. هذا النمط إحداهما مخصّصة للاستخدام في سلسلة التعليمات الرئيسية، مع واجهات برمجة التطبيقات ذات المستوى الأدنى مثبتة في سلسلة Worker، والتحدث إليهم عبر رسائل العمال.
• صيغة تستند إلى التعهد من واجهة Worker API وتخفي تمامًا جوانب التواصل عبر سلاسل المحادثات من المستخدم.
• توفير مساحة تخزين دائمة من جهة العميل باستخدام واجهات برمجة تطبيقات JavaScript المتاحة بما في ذلك نظام الملفات الخاصة المصدر (OPFS).

استخدام SQLite Wasm مع الواجهة الخلفية لثبات نظام الملفات الخاصة في المصدر

تثبيت المكتبة من npm

تثبيت @sqlite.org/sqlite-wasm الحزمة من npm باستخدام الأمر التالي:

npm install @sqlite.org/sqlite-wasm

نظام الملفات الخاصة المصدر

نظام الملفات الخاصة المصدر (OPFS، وهو جزء من File System Access API) التي يتم تعزيزها باستخدام سطح خاص يتيح الوصول الفعّال للغاية إلى البيانات. مساحة العرض الجديدة هذه عن تلك المتوفرة حاليًا من خلال توفير إذن وصول حصري وحصري للكتابة إلى محتوى الملف. هذا التغيير، إلى جانب القدرة على قراءة التعديلات غير الواضحة وتوفُّر صيغة متزامنة على للعاملين المخلصين، ويحسن الأداء بشكل كبير ويسمح للمستخدمين الجدد الحالات.

كما يمكنك أن تتخيل، النقطة الأخيرة من أهداف المشروع، دعم التخزين الدائم من جانب العميل باستخدام واجهات برمجة تطبيقات JavaScript المتاحة، متطلبات أداء صارمة فيما يتعلق بالاحتفاظ بالبيانات في ملف قاعدة البيانات. ومن هنا يأتي دور نظام الملفات الخاصة المصدر، وبشكل أكثر تحديدًا createSyncAccessHandle() طريقة FileSystemFileHandle الكائنات المختلفة. تُرجع هذه الطريقة وعدًا إلى FileSystemSyncAccessHandle يمكن استخدامه للقراءة من الملف والكتابة إليه بشكل متزامن. تشير رسالة الأشكال البيانية فإن الطبيعة المتزامنة لهذه الطريقة لها مزايا الأداء، ولكنها فهي قابلة للاستخدام فقط داخل النطاق المخصص عوامل تشغيل الويب في الملفات داخل نظام الملفات الخاصة المصدر كي لا يتم حظر سلسلة التعليمات الرئيسية.

إعداد العناوين المطلوبة

من بين الملفات الأخرى، يحتوي أرشيف SQLite Wasm الذي تم تنزيله على ملف sqlite3.js وsqlite3.wasm، التي تشكل إصدار sqlite3 WASM/JS. jswasm الدليل على تسليمات sqlite3 الأساسية ودليل المستوى الأعلى تحتوي على تطبيقات للعرض التوضيحي والاختبار. لن تعرض المتصفّحات ملفات Wasm من file:// عنوان URL، لذلك تتطلب أي تطبيقات يتم إنشاؤها باستخدام خادم ويب يجب أن يتضمن الخادم الرؤوس التالية في استجابته عند عرض الملفات:

• Cross-Origin-Opener-Policy الضبط على توجيه same-origin يعزل سياق التصفح حصريًا إلى المستندات ذات المصدر نفسه. ولا يتم تحميل المستندات المشتركة المصدر في سياق التصفّح نفسه.
• Cross-Origin-Embedder-Policy الضبط على توجيه require-corp وبالتالي يمكن للمستند تحميل موارد من المصدر نفسه أو الموارد نفسها فقط تم وضع علامة عليها بوضوح كقابلة للتحميل من مصدر آخر.

سبب هذه العناوين هو أن SQLite Wasm يعتمد على SharedArrayBuffer، ويُعد إعداد هذه العناوين جزءًا من متطلبات الأمان.

إذا فحصت عدد الزيارات باستخدام "أدوات مطوري البرامج"، من المفترض أن يظهر ما يلي: المعلومات:

الاختبار السريع

قام فريق SQLite بتشغيل بعض مقاييس الأداء على تنفيذ WebAssembly مقارنة بـ SQL على الويب المتوقّفة. تظهر هذه المعايير أن SQLite Wasm هي بنفس سرعة SQL على الويب. أحيانًا يكون التحميل أبطأ قليلاً وفي بعض الأحيان إنه أسرع قليلاً. يمكنك الاطّلاع على جميع التفاصيل في صفحة النتائج.

نموذج التعليمات البرمجية للبدء

كما ذكرنا سابقًا، SQLite Wasm مع نظام Origin Private File System يجب تشغيل الواجهة الخلفية للمثابرة من سياق العامل. والخبر السار هو أن ستتولّى المكتبة كل هذا الأمر تلقائيًا، ويمكنك استخدامها من سلسلة التعليمات الرئيسية مباشرةً.

import { sqlite3Worker1Promiser } from '@sqlite.org/sqlite-wasm';

(async () => {
  try {
    console.log('Loading and initializing SQLite3 module...');

    const promiser = await new Promise((resolve) => {
      const _promiser = sqlite3Worker1Promiser({
        onready: () => {
          resolve(_promiser);
        },
      });
    });

    console.log('Done initializing. Running demo...');

    let response;

    response = await promiser('config-get', {});
    console.log('Running SQLite3 version', response.result.version.libVersion);

    response = await promiser('open', {
      filename: 'file:worker-promiser.sqlite3?vfs=opfs',
    });
    const { dbId } = response;
    console.log(
      'OPFS is available, created persisted database at',
      response.result.filename.replace(/^file:(.*?)\?vfs=opfs$/, '$1'),
    );

    await promiser('exec', { dbId, sql: 'CREATE TABLE IF NOT EXISTS t(a,b)' });
    console.log('Creating a table...');

    console.log('Insert some data using exec()...');
    for (let i = 20; i <= 25; ++i) {
      await promiser('exec', {
        dbId,
        sql: 'INSERT INTO t(a,b) VALUES (?,?)',
        bind: [i, i * 2],
      });
    }

    console.log('Query data with exec()');
    await promiser('exec', {
      dbId,
      sql: 'SELECT a FROM t ORDER BY a LIMIT 3',
      callback: (result) => {
        if (!result.row) {
          return;
        }
        console.log(result.row);
      },
    });

    await promiser('close', { dbId });
  } catch (err) {
    if (!(err instanceof Error)) {
      err = new Error(err.result.message);
    }
    console.error(err.name, err.message);
  }
})();

عرض توضيحي

يمكنك الاطّلاع على الرمز البرمجي أعلاه عمليًا في العرض التوضيحي. تأكد من الاطلاع على رمز المصدر حول Glitch لاحِظ أنّ الإصدار المضمَّن أدناه لا يستخدم الواجهة الخلفية OPFS. ولكن عند فتح العرض التوضيحي في فصل علامة التبويب.

تصحيح أخطاء نظام الملفات الخاصة المصدر

لتصحيح أخطاء مخرجات نظام الملفات الخاصة لـ SQLite Wasm's Origin، استخدم العنصر مستكشِف OPFS إضافة Chrome.

بعد تثبيت الإضافة، افتح "أدوات مطوري البرامج في Chrome" واختَر OPFS. Explorer (المستكشف)، وتكون جاهزًا بعد ذلك لفحص ما يكتبه SQLite Wasm إلى نظام الملفات الخاصة المصدر

إذا قمت بالنقر فوق أي من الملفات في نافذة OPFS Explorer في أدوات مطوري البرامج، يمكنه حفظه على القرص المحلي. يمكنك بعد ذلك استخدام تطبيق مثل عارِض SQLite لفحص قاعدة البيانات، ما يتيح لك وأؤكد لنفسك أن SQLite Wasm تعمل في الواقع كما وعدنا.

الحصول على المساعدة وتقديم الملاحظات

تم تطوير وصيانة SQLite Wasm من قبل مجتمع SQLite. الحصول على المساعدة تقديم الملاحظات من خلال البحث في الدعم. تتوفر المستندات على موقع SQLite.

شكر وتقدير

صورة رئيسية من إعداد توبياس فيشر على إزالة البداية