タグ

articleとi18nに関するefclのブックマーク (7)

  • Benchmarking, Profiling, and Optimizing JavaScript libraries

    Introduction I wish to bring you with me on a journey to learn about optimizing a library for localization, I would like to share my learnings with you on benchmarking, profiling, and optimizing. At Swissquote Bank, we use client-composed micro-frontends, and our platforms are usually available in at least 8 languages. To support this requirement, we had to build a translation/localization library

    efcl
    efcl 2023/12/08
    MessageFormatを扱うライブラリのベンチマーク
  • Intl.Segmenter で和文の改行をいい感じにしてみる

    tl;dr ブラウザで文字列を表示する場合画面幅に応じて自動で改行されることがあります。英文などは分かち書きされているためブラウザは単語の区切りなどで改行することができますが、和文は文節が明確ではなく単語の途中で改行されてしまうことがあります。 この記事では、ECMA402 の Intl.Segmenter を用いて和文を分かち書きし、ブラウザに改行可能箇所を教えることでより読みやすいレイアウトを目指します。 (2023/04/14 追記) NPM package として公開しました 🚀 背景 ラテン文字を使用する多くの言語では語と語が空白で区切られていますが(以降分かち書き)、通常、日語や中国語は分かち書きされていません。 一般的なブラウザでは表示領域(横幅)に対して表示させたい文字列が一行に収まらない場合自動で改行するような挙動になっています。英語のように既に分かち書きされた文の場

    Intl.Segmenter で和文の改行をいい感じにしてみる
    efcl
    efcl 2022/10/09
    `Intl.Segmenter`を使った分かち書きを考慮した改行の実装について。 また、JavaScriptエンジンの実装による違いとHydrationでの差異を無視する方法について
  • Locale Aware Sorting in JavaScript

    This post is part of my Byte Series, where I document tips, tricks, and tools that I've found useful. ProblemWhen building a localized JavaScript web-app, the default sorting logic for strings doesn't quite yield the results that you might expect. For example, take the following example… let strings = [ "nop", "NOP", "ñop", "abc", "abc", "äbc" ]; strings.sort(); console.log(strings); // ['NOP', 'a

    Locale Aware Sorting in JavaScript
    efcl
    efcl 2022/04/05
    `Intl.Collator`を使ったローカライズされた文字列のソートについて
  • Listify a JavaScript Array

    Listify a JavaScript ArrayFebruary 18th, 2021 — 6 min read When you want to display a list of items to a user, I'm afraid .join(', ') just won't cut it: console.log(['apple'].join(', ')) // apple // looks good console.log(['apple', 'grape'].join(', ')) // apple, grape // nah, I want "apple and grape" console.log(['apple', 'grape', 'pear'].join(', ')) // apple, grape, pear // wut? Ok, so bust out y

    Listify a JavaScript Array
    efcl
    efcl 2021/02/23
    `Intl.ListFormat`を使うことで、"A, B, and C"のような言語に応じたandとorの表現を作成できるという話
  • An update on MDN Web Docs’ localization strategy – Mozilla Hacks - the Web developer blog

    In our previous post — MDN Web Docs evolves! Lowdown on the upcoming new platform — we talked about many aspects of the new MDN Web Docs platform that we’re launching on December 14th. In this post, we’ll look at one aspect in more detail — how we are handling localization going forward. We’ll talk about how our thinking has changed since our previous post, and detail our updated course of action.

    An update on MDN Web Docs’ localization strategy – Mozilla Hacks - the Web developer blog
    efcl
    efcl 2020/12/12
    Tier 1ロケール(中国語とフランス語と日本語)についてはメンテナがいれば手動翻訳を受け入れる方針に変更
  • TypeScriptで実現する型安全な多言語対応(Angularを例に) - 株式会社カブク

    フロントエンドエンジニアの今村です。 この記事はAngular Advent Calendar 2018 11日目の記事で、テーマは多言語対応です。 Angular Advent CalendarなのでAngularの話を中心に書きますが、手法としてはAngularに限らず、ひろく(TypeScriptで書かれた)Webフロントエンド全般の多言語対応に適用可能なものです。というのも、私は以前にも似たような記事をQiitaに投稿していて、その時はReactをやっていました。 この記事ではQiitaに投稿した方法を少し改良したやり方をご紹介しますが、TypeScriptの型に甘えて多言語対応を実現したいという気持ちは一貫しています。 TL;DR 辞書ファイルをTypeScriptで書きたいという思いのもと、Angularの標準のi18n機能やその他のライブラリに頼らずに実装した多言語対応を紹介

    TypeScriptで実現する型安全な多言語対応(Angularを例に) - 株式会社カブク
    efcl
    efcl 2018/12/31
    翻訳ファイルをTypeScriptのコードとして表現することで型安全な翻訳定義を作成する方法について。 翻訳ファイルをコードにするメリットとデメリットについてなど
  • i18nの書き方 from JavaScript - Qiita

    続編と、コード自体ではなく、何をすればいいかを書きましたAmazonに見るi18n -「国際化対応」とは何を変える事か Webサイトを多言語化する 最近多言語化に関する仕事をしている関係でi18n(l10n)用のライブラリを色々と見たので、 i18nライブラリによくある使い方を紹介します。 とは言ってもほとんどのライブラリは同じような書き方をするのでJavaScriptを例にします。 ライブラリ一覧 書き方の紹介として使用するものはawasome-javascriptにあるものと、他に気になったものを選びました。 ただし、この記事の目的は「書き方」を紹介するもので「ライブラリ」を紹介するものではありません。 動くことは確認しましたがどのくらいまともに動くかはチェックしていないのでご注意ください。 Polyglot Airbnbが公開するシンプルなライブラリ i18next 色々な環境やフレ

    i18nの書き方 from JavaScript - Qiita
    efcl
    efcl 2017/02/19
    i18nのライブラリがどのような事をしているのかや、言語による違いにはどのようなものがあるかについて。 いくつかのi18nライブラリを例に多言語化のやり方について解説されている記事
  • 1