I want to use the Locize CDN, but would like to have a fallback that uses local/bundled translations
The Locize CDN delivers translations globally and reliably. However, in some environments — such as highly regulated or restricted corporate networks — CDN access may be blocked or unreliable.
To ensure your app always has access to translations, you can combine the power of the Locize CDN with a local or bundled fallback. This way, your app will use the CDN when available, but automatically fall back to local resources if the CDN cannot be reached.
This approach is often preferable to always bundling all translations, as it gives you the best of both worlds: up-to-date translations from the CDN and guaranteed availability from your local bundle.
How to Set Up a CDN Fallback with i18next
If you use i18next, you can achieve this easily with the i18next-chained-backend plugin. This allows you to define multiple backends (e.g., Locize CDN first, then local resources as fallback).
Example:
import i18next from 'i18next';
import ChainedBackend from 'i18next-chained-backend';
import LocizeBackend from 'i18next-locize-backend';
import LocalBackend from 'i18next-localstorage-backend'; // or i18next-fs-backend for Node.js
i18next
.use(ChainedBackend)
.init({
backend: {
backends: [LocizeBackend, LocalBackend],
backendOptions: [
{
// Locize options
projectId: 'YOUR_PROJECT_ID',
apiKey: 'YOUR_API_KEY',
referenceLng: 'en',
},
{
// Local backend options
}
]
},
// ...other i18next options
});For more detailed usage and advanced scenarios, see the backend fallback documentation.