Overview of JavaScript Localization

Although well-defined in the client-app world, localization of JavaScript code is not very well supported. Ajax Minifier attempts to provide a solution by utilizing .NET .RESX and/or .RESOURCES files in your project to produce localized scripts. What Ajax Minifier does is create a virtual global object from a .RESX or .RESOURCES file that contains named properties corresponding to the string resources in the resource file. The developer codes the JavaScript sources, referencing localizable strings from that global property. When the JavaScript source is minified with the .RESX or .RESOURCES file, the references to that virtual global object are replaced with the actual string literals in the resource file.

Example

Let’s say you have the following RESX file, named en.resx. It defines three string resources: Farewell, Greeting, and MyName.

en.resx

By default, the virtual global object that Ajax Minifier uses is named “Strings,” but you can specify any valid JavaScript name you wish. If we stick with the default, you simply code your JavaScript as if the String object exists, and there are three properties on it that match the names of the three string resources:

function foo(name)
{
    document.write("<h1>" + Strings.Greeting + "</h1>");
    document.write("<h2>" + Strings.MyName.replace("{0}", name) 
        + Strings.Bar + "</h2>");
    document.write("<h2>" + Strings.Farewell + "</h2>");
}

When minifying your source script, simply use the –res switch to add in your resources. For example, if your JavaScript file is named foo.js, and you have four .RESX files, en.resx, fr.resx, ru.resx, and zh.resx, these four commands would generate your four localized JavaScript files:

ajaxmin.exe foo.js –o foo.en.js –resx en.resx
ajaxmin.exe foo.js –o foo.fr.js –resx fr.resx
ajaxmin.exe foo.js –o foo.ru.js –resx ru.resx
ajaxmin.exe foo.js –o foo.zh.js –resx zh.resx

For default builds, the virtual global object is never actually created; references to its properties in your source code are replace with string literals in your code. If there is no string resource with the same name as the property, it is replaced with an empty string literal.

If you wish to use a different virtual global object name, specify it on the –res switch. For example, to use MyLocStrings, the command-line would look like:

ajaxmin.exe foo.js –o foo.fr.js –resx:MyLocStrings fr.resx

Last edited Oct 17, 2011 at 11:05 PM by ronlo, version 5

Comments

No comments yet.