Con SQLite Wasm respaldado por el sistema de archivos privado de origen, existe un reemplazo versátil para la tecnología de base de datos de SQL web obsoleta. Este artículo es una guía para migrar tus datos de Web SQL a SQLite Wasm.
Fondo obligatorio
En la entrada Baja y eliminación de Web SQL, se anunció la baja de la tecnología de la base de datos Web SQL. Si bien la tecnología en sí puede estar obsoleta, los casos de uso que aborda en gran medida no lo son, por lo que en la publicación de seguimiento SQLite Wasm en el navegador respaldado por Origin Private File System, describe un conjunto de tecnologías de reemplazo basado en la base de datos SQLite, compilada en Web Assembly (Wasm) y respaldada por el sistema de archivos privados de origen. Para cerrar el círculo, este artículo muestra cómo migrar bases de datos de Web SQL a SQLite Wasm.
Migra tus bases de datos
Los siguientes cuatro pasos demuestran la idea conceptual de migrar una base de datos de Web SQL a SQLite Wasm, con la base de datos de SQLite respaldada por el sistema de archivos privado de origen. Esto puede servir como base para tu propio código personalizado según tus necesidades de migración de SQL Web.
Las bases de datos de SQL web que se migrarán
El supuesto de referencia de esta guía de migración es que tienes una (o varias) bases de datos de Web SQL existentes que contienen datos relevantes para tu app. En la siguiente captura de pantalla, se muestra una base de datos de ejemplo llamada mydatabase con una tabla de tormentas que asigna estados de ánimo a severidades. Las herramientas para desarrolladores de Chrome te permiten ver las bases de datos de WebSQL para depurarlas, como se muestra en la siguiente captura de pantalla.
Traducción de la base de datos Web SQL a instrucciones SQL
Para migrar los datos de una manera transparente para el usuario, es decir, sin que deba realizar ninguno de los pasos de migración por su cuenta, los datos de la base de datos deben volver a traducirse a las instrucciones SQL originales que los crearon en primer lugar. Este desafío ya se presentó antes, y la secuencia de comandos de migración que se usa en este artículo (mywebsqldump.js) se basa en una biblioteca de la comunidad llamada websqldump.js, con algunos ajustes menores. En la siguiente muestra de código, se muestra el código necesario para traducir la base de datos de Web SQL mydatabase a un conjunto de instrucciones SQL.
websqldump.export({
database: 'mydatabase',
version: '1.0',
success: function(sql) {
// The SQL statements.
},
error: function(err) {
// Handle the error.
}
});
Si ejecutas este código, se mostrará la siguiente cadena de instrucciones de SQL.
CREATE TABLE IF NOT EXISTS rainstorms (mood text, severity int);
INSERT INTO rainstorms(mood,severity) VALUES ('somber','6');
INSERT INTO rainstorms(mood,severity) VALUES ('rainy','8');
INSERT INTO rainstorms(mood,severity) VALUES ('stormy','2');
Cómo importar los datos a SQLite Wasm
Lo que resta es ejecutar estos comandos SQL en el contexto de SQLite Wasm. Para obtener todos los detalles sobre la configuración de SQLite Wasm, te recomendamos que leas el artículo SQLite Wasm en el navegador respaldado por el sistema de archivos privado de Origin, pero aquí tienes un resumen. Recuerda que este código debe ejecutarse en un trabajador (que la biblioteca crea automáticamente por ti) con los encabezados HTTP obligatorios configurados correctamente. Puedes instalar el paquete @sqlite.org/sqlite-wasm desde npm.
import { sqlite3Worker1Promiser } from '@sqlite.org/sqlite-wasm';
(async () => {
try {
const promiser = await new Promise((resolve) => {
const _promiser = sqlite3Worker1Promiser({
onready: () => {
resolve(_promiser);
},
});
});
let response;
response = await promiser('open', {
filename: 'file:mydatabase.db?vfs=opfs',
});
const { dbId } = response;
const sql = `
CREATE TABLE IF NOT EXISTS rainstorms (mood text, severity int);
INSERT INTO rainstorms(mood,severity) VALUES ('somber','6');
INSERT INTO rainstorms(mood,severity) VALUES ('rainy','8');
INSERT INTO rainstorms(mood,severity) VALUES ('stormy','2');`
await promiser('exec', { dbId, sql });
await promiser('close', { dbId });
} catch (err) {
if (!(err instanceof Error)) {
err = new Error(err.result.message);
}
console.error(err.name, err.message);
}
})();
Después de ejecutar este código, inspecciona el archivo de base de datos importado con la extensión OPFS Explorer para las Herramientas para desarrolladores de Chrome. Ahora hay dos archivos, uno con la base de datos real y otro con información de diario. Ten en cuenta que estos dos archivos se encuentran en el sistema de archivos privado de origen, por lo que debes usar la extensión del Explorador de OPFS para verlos.
Para verificar que los datos importados sean los mismos que los datos iniciales de Web SQL, haz clic en el archivo mydatabase.db y la extensión del Explorador de OPFS mostrará un diálogo Save File para que puedas guardar el archivo en el sistema de archivos visible para el usuario. Con el archivo de la base de datos guardado, usa una app de visor de SQLite para explorar los datos. Project Fugu API Showcase incluye varias apps para trabajar con SQLite en el navegador. Por ejemplo, Sqlime — SQLite Playground te permite abrir un archivo de base de datos SQLite desde el disco duro y ejecutar consultas en la base de datos. Como se ve en la siguiente captura de pantalla, la tabla rainstorm se importó correctamente a SQLite.
Libera el almacenamiento de Web SQL
Si bien (tal vez sea sorprendente) es imposible borrar una base de datos de Web SQL, debes liberar espacio de almacenamiento descartando las tablas de Web SQL ahora obsoletas después de migrar los datos a SQLite Wasm. Para enumerar todas las tablas de una base de datos de Web SQL y descartarlas con JavaScript, usa el código como en el siguiente fragmento:
const dropAllTables = () => {
try {
db.transaction(function (tx) {
tx.executeSql(
"SELECT name FROM sqlite_master WHERE type='table' AND name !='__WebKitDatabaseInfoTable__'",
[],
function (tx, result) {
const len = result.rows.length;
const tableNames = [];
for (let i = 0; i < len; i++) {
const tableName = result.rows.item(i).name;
tableNames.push(`'${tableName}'`);
db.transaction(function (tx) {
tx.executeSql('DROP TABLE ' + tableName);
});
}
console.log(`Dropped table${tableNames.length > 1 ? 's' : ''}: ${tableNames.join(', ')}.`);
}
);
});
} catch (err) {
console.error(err.name, err.message);
}
};
Cómo trabajar con los datos después de la migración
Después de migrar los datos, trabaja con ellos como se describe en esta muestra de código de introducción. Consulta la referencia de la API de SQLite Wasm para obtener más detalles. Una vez más, te recordamos que debes acceder a SQLite Wasm desde un trabajador si usas el sistema de archivos privados de origen como tu backend de almacenamiento.
Pruébalo
Esta demo te permite propagar una base de datos de SQL web con datos de muestra y, luego, volcar los datos de SQL web como sentencias SQL, que luego se importan a SQLite Wasm con la copia de seguridad del sistema de archivos privado de origen. Por último, liberas espacio de almacenamiento cuando borras los datos obsoletos de Web SQL. Verifica el código fuente para ver la implementación completa, incluido el archivo mywebsqldump.js parcheado.
Conclusiones
Migrar tus bases de datos de SQL web a SQLite Wasm con el respaldo del sistema de archivos privado de origen es posible de una manera transparente para tus usuarios. No notará que sus datos ahora se alojan en el sistema de archivos privado de origen en una base de datos SQLite y que ya no se encuentran en Web SQL. En general, migrar de Web SQL a SQLite es un paso necesario para los desarrolladores web que desean garantizar la estabilidad y escalabilidad a largo plazo de sus aplicaciones. Si bien el proceso puede requerir un esfuerzo inicial, los beneficios de una solución de base de datos más sólida, flexible y, sobre todo, preparada para el futuro hacen que valga la pena la inversión.