Lazy Translator

The Lazy Translator is a feature in typed-locale that allows you to load translations on-demand, which can be particularly useful for large applications or when you want to optimize the initial load time of your app.

Implementation

The lazy translator is implemented using the createLazyTranslator function. This function takes two parameters:

A lazy load function that fetches translations
An optional object of initial translations

Here's how you can implement a lazy translator:

import {createLazyTranslator, LazyLoadFunction} from 'typed-locale';

const lazyLoadFn: LazyLoadFunction = async (paths: string[]) => {
  // Implement your lazy loading logic here
  // This could be an API call or loading from a local file
  const translation = await fetchTranslation(paths);
  return translation;
};

const initialTranslations = {
  // Optional: Add any initial translations you want to have available immediately
};

const lazyTranslator = createLazyTranslator(lazyLoadFn, initialTranslations);

Usage

You can use the lazy translator similarly to the regular translator, but it returns a Promise that resolves to the translated string:

const translatedText = await lazyTranslator(t => t.hello);
console.log(translatedText); // 'Hello'

const translatedTextWithName = await lazyTranslator(t => t.helloName({name: 'World'}));
console.log(translatedTextWithName); // 'Hello, World'

Caching

The lazy translator automatically caches loaded translations, so subsequent requests for the same key will not trigger additional lazy loading. This caching mechanism is implemented in the loadTranslations function:

Benefits

Reduced Initial Load Time: By loading translations on-demand, you can significantly reduce the initial load time of your application, especially for large translation sets.
Memory Efficiency: Only the translations that are actually used are loaded into memory, which can be beneficial for memory-constrained environments.
Flexibility: You can implement custom loading logic, allowing you to fetch translations from various sources (e.g., API, local storage, files).
Type Safety: Despite being lazy-loaded, the translator still maintains full type safety, ensuring that you're using correct translation keys and variables.

Considerations

While lazy loading can be beneficial, it's important to consider the trade-offs:

Network Requests: Each lazy load may result in a network request, which could impact performance if not managed properly.
Complexity: Implementing lazy loading adds some complexity to your application, which may not be necessary for smaller projects.
User Experience: There might be a slight delay when accessing translations for the first time, which could affect the user experience if not handled properly (e.g., with loading indicators).

By understanding these considerations, you can make an informed decision about whether to use the lazy translator in your project.