perf(web): replace runtime pinyin with provider initials lookup (#42861)

pnpm-lock.yaml

@@ -1611,9 +1611,6 @@ importers:
       nuqs:
         specifier: 'catalog:'
         version: 2.10.1(next@16.3.6(@babel/core@7.29.7(supports-color@11.0.0))(@playwright/test@1.62.1)(@types/node@25.9.7)(react-dom@19.3.0(react@19.3.0))(react@19.3.0))(react@19.3.0)
-      pinyin-pro:
-        specifier: 'catalog:'
-        version: 3.29.4
       qrcode.react:
         specifier: 'catalog:'
         version: 4.2.0(react@19.3.0)
@@ -1819,6 +1816,9 @@ importers:
       i18next-resources-for-ts:
         specifier: 'catalog:'
         version: 2.1.0(@swc/helpers@0.5.23)
+      pinyin-pro:
+        specifier: 'catalog:'
+        version: 3.29.4
       playwright:
         specifier: 'catalog:'
         version: 1.63.0

web/app/components/workflow/block-selector/__tests__/utils.spec.ts

@@ -0,0 +1,45 @@
+import { pinyin } from 'pinyin-pro'
+import { describe, expect, it } from 'vitest'
+import { compareProviderLetters, getProviderLetter } from '../utils'
+
+describe('provider letter grouping', () => {
+  it('preserves the pinyin-pro grouping of every supported Chinese character', () => {
+    const differences: string[] = []
+    for (let code = 0x4e00; code <= 0x9fa5; code++) {
+      const character = String.fromCharCode(code)
+      const initial = (
+        pinyin(character, { pattern: 'first', toneType: 'none' })[0] || character
+      ).toUpperCase()
+      const expected = /[A-Z]/.test(initial) ? initial : '#'
+      if (getProviderLetter(character) !== expected) differences.push(character)
+    }
+    expect(differences).toEqual([])
+  })
+
+  it.each([
+    ['a', 'A'],
+    ['Z', 'Z'],
+    ['1', '#'],
+    ['-', '#'],
+    ['', '#'],
+    ['é', '#'],
+    ['〇', '#'],
+    ['龦', '#'],
+    ['😀', '#'],
+    ['重', 'Z'],
+    ['长', 'C'],
+    ['行', 'X'],
+  ])('groups %j under %s', (character, expected) => {
+    expect(getProviderLetter(character)).toBe(expected)
+  })
+
+  it('sorts letters alphabetically and places the fallback group last', () => {
+    expect(['#', 'Z', 'A', 'C', 'A'].sort(compareProviderLetters)).toEqual([
+      'A',
+      'A',
+      'C',
+      'Z',
+      '#',
+    ])
+  })
+})

web/app/components/workflow/block-selector/provider-initials.generated.ts

@@ -0,0 +1,29 @@
+// Generated by pnpm --dir web gen-provider-initials. Do not edit.
+// Single-character initials derived from pinyin-pro 3.29.4 (https://github.com/zh-lx/pinyin-pro).
+/*
+MIT License
+
+Copyright (c) 2022-present zh-lx
+
+Permission is hereby granted, free of charge, to any person obtaining a copy
+of this software and associated documentation files (the "Software"), to deal
+in the Software without restriction, including without limitation the rights
+to use, copy, modify, merge, publish, distribute, sublicense, and/or sell
+copies of the Software, and to permit persons to whom the Software is
+furnished to do so, subject to the following conditions:
+
+The above copyright notice and this permission notice shall be included in all
+copies or substantial portions of the Software.
+
+THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR
+IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY,
+FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE
+AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER
+LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM,
+OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE
+SOFTWARE.
+*/
+
+// Indexed by UTF-16 code unit minus U+4E00, through U+9FA5 inclusive.
+export const providerInitials =
+  'YDKQSXHWZSSXQBYMGCCZQPSSQBYCDSCDQLDYLYBSGJGYPZJJFGCCLZZBWDWZJLJPFYYNWJJTMYYZWZHFLYPPQHGCCYHYNJQYXXGJX#SDSJNJJSMHML#RXYFSNQSYZZQZGQLLYJLGYZSSECYKYYHQWJSSGGYXYQYJTWKDJHYCHMYXJTLXJYQBYXDLDWRRJJWYSRLDZJPCBZJJBRCFJLBCZSTZFXXTHTRQGYBDLYCCSCYMMRFCYQZPWWJJYFCRWFDFZQPYDDWYXKYJAWJFFXJPDFTZYHHYCYSWCCYQSCLCXXWZCXNBGNNXBXLZSQSBSJPYSYZDHMDZBQBZCWDZZYYTZHBTSYYFZGNTNXQYWQYKBPHGLXGYBFMJEBJHHGQTJCYSXSTKZGLYCKGLYSMZXYALMELDCCXGZYRJXSDLTJZCQKCNNJWHJCZZCQLJSTSTBNXBTYXCEQXGKWJYFLZQLYHJQSPSFXLFPBYSXXXYDCCZYLLLSJXFHJXPJBCFFYABYXBHCZBJYCLWLCZGGBTSSMDTJCXPTHYQTGLJSCJFZKJZJQNLZWLSLHDZBWJNCJZYZSQNYCQYRZCJJWYBRTWPYFTWEXCSKDZCTBXHYZCAYJXZCFBZZMJYXXCDCZOTTBZLJWFCKSZSXFYRLNYGMBDTHJXSQQCCSBXRYTSYFBJDZTGBCNCLCYZZPSACYZQSCJCSHZQYDXLBPJLLMQXTYDZXSQJTZPXLCGLQDCWJBHCTDJJSFXYEJJTLBGXSXJMYJJQPFZASYJNCYDJXKJCDJSZCBARTCCLNJQMWNQNCLLLKBYBZZSYHQCLTWLCCRSHLLZNTYLNEWYZYXCZXXGDKDMTCEDEQTSYYS#D#D##SD#J#HRWNQLYBGLXHLGTGXBQJDZ#YJSJYJCJMRNYMGRCJCZGJMZMGXMMRYXKJNYMSGMZZYMKLFXMBDTGFBHCJYKYLPFMDXLQJJSMTQGZSJLQDLDGJYCALCMZCSDJLLNXDJFFFFJCZFMZFFPFKHKGDPKXKTACJDHHZDDDRRCFQYJKQCCWJDXHWJLYLLZGCFCQDSMLZPBJJPLSBCJGGDCKKDEZSQCCKJGCGKDJTJLLZYCXKLQCCGJCLTFPCQCZGWBJDQYDJJBYJHSJDDWGFSJGDKCCCTLLPSPKJGQJHZZLJPLGJGJJTHJJYJZCZMLZLYQBGJWMLJKXZDZNJQSYZMLJLLJKYWXMKJLHSKJGBMCLYYMKXJQLBMCLKMDXXKWYXWSLMLPSJQJJQXYQFJTJDXMXXLLCRQBSYJBGWY#XGGBCYXPJTGPEPFGDJGBHBNCFJYZJKJKHXQFGQZKFHYGKHDKLLSDJJXPQYKYBNQSXQNSZSWHBSXWHXWBZZXDMNDJBSBKBBZKLYLXGWXJJWAQZMYWSJQLCJXXJQWJEQXSCWETLZHLYYYSDZPYQYZCMTLSHTZCFYCYXYLJSDCJJAGYSLCLLYYYSGLQQQ#LDXZSCCCCADYCJYSFSGBFRLSZQSBXJPSJWSDRCKGJLGDKZJZBDKTCSYQPYHSTCLDJ#HMXMCGXYZHJDCTMHLTXZXYLAMOHYJCLTYFBQQJBFBDFEHTKSQHZYWWCNXXCDWHHWGYJLEGWDMCWGFJHCSNTFYDOLBYGHQWESJPWNMLRYDZSZTXYQPZGCWHHNXPYHSHMDQZXZTDPPBFYHZHHJYFDZWKGKZBLDNTSXHQEEGZXYLZMMZYJZGSZXHHKHTXEXXWYLYAPSTHXDWHZYDPXAGKYDXBYNHXKD#JNMYHYLPMGOCSLNZHKXXLBZZLBMLSFBHHGCGYYGGBHSCYAJTYWLXTZQCWZYDQDQM#GD#LLSZHLSJZWFYHQSWSCELQAJYNYTLSXTHAZGKZZSDHLACQTWWCDGQQTDDYZBCCHYQZFLXPSLZYGPZSZNGLYDQTBDLXJTCTAJDKYWNSYZLJHHDZCWNXYZYWMHYCHHHXHJKZWSXHDYXLYSCQYDPCLYZWMYP#KXYJLKZHTYHAXQSYSGXASMCHKDSCRSWJPWXSGZJLWWSCHS#HSQNHZSNGNDAQTBAALZZMSSTDQJCJKTSCJAXPLGGJHHGOXZCXPDMMHLDGTYBYSJMXHMRZPLXJZCKZXSHFLQXCTDHXEZFCHZCCDJTCJYXQHLXDHYPJQXNLSYYDZOZJNYXQEZYSJYAYJKYPDGXDDXSPPYZNDLTHRHHYDXZJJHTCXMCTLHBYNYHMHZLLXNAMYLLLPDCPPXHMXDKYCYRDLTXJCHHZNXZLCCLYLNZSXZJZZLNN#LWHYQSNJHXYNTTTKYJPYCHHYEGKCWTWLGQRLGGTGTYGYHPYHYLQYQGCWYQKPYYYTTTTLHYHLLTYTTSPLKYZXGTWGPYDQQZZDQXSKCQNMJJZZBXYQMJRTFFBTKHZKBJDJJKDJJTLBWFZPPTKQTZTGPDWNTPJYFALQMKGXFDCLZFHZCLLLLADPMXDJHLCCLGYHDZFGYDDGCYYFGYDXKSSEBDHYKDKDKHNAXXYBPBYYHXCCGABDQYJXDMLJCSQZLLPCHBSXGJYNDYBYQSPQWJLZKTDDTACCBKZDYZYPJZQSJNKKTKNJDJGYEPGTLFYQKASDNTCYHBLGDZHBBYDMJRAGKZYHEYYBJMCDTYFZJJHGCJPLJHLDWXJJKYTCYKSSSMTWCTTQZLPBSZDTWZXGZAGYXTYWXLHLCPBCLLOQMMZSSLCMBJQSDZKYDCZXGQJDSMCYTZQQLWZQZXSSFPKTFQMDDZDSDDTDWFHTDYZJAQJQKYPBDJYYXTLJHDRQXLXHAYDHRJLKLYTWHLLRLLRCXYLBWSRSZZSYMKZZHHKYHXKSMCSYZGCJPBZBSQLFCXXXNXKXWWMSDDYQ#GGQMMYHCDCTTFGYYHGSTTTYBYKJDHKYJBELHDYPJQNFXFDQKZHQKZBYJTZBXHFDXBDASWHAWAJLDYJSFHBLDNNDNQJTJNCHXFJSRFWHZFMDRFJYHWZPDJKZYJYMFCYZNYNXFBYTFWFWYGDBNZZZDNYTXZEMMQBSQEHXFZMBMFLZZSRSYMJGSXWZJSPRYDJSJGXHJJGLJJYNZZJXHGJKYMLPEYYCXYSGQZSWHWLYRJLPXSLCXMFSWWKCCTNXNYNPNJSZHDZEPTMMWYWXYYSYWLXJQZQXZDCLAEELMCPJPCLWBXSQHFWWTFFJTNQJHJQDXHWLBYZCFJLNLHYYJLDXHHYCSTDYWNRJTXYWDRMDRQHWQCMFJDYZMHMAYXJWMYZQTXDLMRSPWWCHAJBXTGCYPXYYRRCLMPAMGKQJSZYJRMYJSNXTPLNBAPPYPYLXMYZKYNLDGYJZCZHNLMZHHANQMPGWQTZMXXMLLHGDZXYHXKRXYCJMFFXYHJFSBSSQLQXNDYCANNMTCJCYPRRNYTYQNYYMBMSXNDLYLYSLJNLQYSXHMLLYZLZJJJKYMZCSFBZXXMSTBJGNXYZHLSNMCQSCYZNFZLXBRNNNYLMNRTGZQYSATSWRYHYJZMZDHZGZDWYBSSCSKXSYHYTSXGCQGXZZBHYXJSCRHMKKBSCJJYJYMKQHZJFNBHMQHYSNJNZYBKNQMCLGQHWLSNZSWXKHLJHYYBQCBFCDSXDLDSPFZFSKJJZWZXSDDXJSEEEGJSCSSMGCLXXHWWYLLYMWWWGYDKZJGGGTGGSYCKNJWNJPCXBJJTQTJWDSSPJXZXNZXWMELBTFSXTLLXCLJXJJLJSXCTNSWXLAHHHYQRWHSYCSQRYBYAYWJEJQFWQCQQCJQGXALDBZZYJGKGXPLTQYFXJLTPADKYQHPMATLDPDZKXMTXYBHBLEFXDLEEGQDYMSAWHZMLFTWYQXLYQZLJEEYXBQQFFNLYXRDSCTGJGXYWLKLLXQKCCTLHJLQMKKZGCYYGLLLJDZGYDHZWXPYSJBZJDZGYZZHYWYFQYTYZSZYEZKLYMHJJHTSMQWYZLKYYWZCSRKQYQLTCXWCDRJALWSKZWBDCQYNCJSRSZJLKCDCDTLZZZACQQWZDDXYPLXCBQJYLZLLLQDTZJJYJYJZYXNYYYNXJXKGDAZWYRDLJYYYRJLXLLDYXJCYKYWNQCCLDDNYYYKYCKCZHJXCCLGZQJGJWGGCQQJYSBZZXYJXJ#XJFZBSBDSFNSFPZXHDWZTDMPPTFLZZBZDMYYPQJRSDZSQZSQXBDGCPZJWDWCSQZGMZHZZMWWFYBPDGPHTMJTHZSMMBGZMBZJCFZHFZBBZMQCFMBCMCJXLGPNJBBXGYHYYJGPTZGZMQBQDCGYBJXLWZKYDPDYMGCFTPFXYZTZXDZXTGKMTYBBCLBJASKYTSSQYYMSCXFJEGLSLLSZBQJJJAKLYLDLYCCTSXMCWFGKKBQXLLLLJYXTYLTYXYTDPJHNHGNKBYQNFJYYZBYYESSESSGDYHFHWTCJBSDZJTFDMXHCNJZYMQWSRXJDZJQPTQBBSDJGGFBKJBXDGQHMGWJJJGDLLTHZHHYYYYYHSXWTYYYCCBDBPYPZYCCZTJPZYWCBDLFWZCWJDXXHYHLHWCZXJTCCLCDPXDJCZCZLYXJJSJBHFXWPYWXZPTDZZBDCCJHJHMLXBQXXBYLRDDGJRRCTTTGYTCZWMXFYTMMZCWJWXJYWCSKYBZQCCTTQNHXNKXXKHKFHTSWOCCJYBCMPZZYKBNNZPBTHHCDLSYDDYTYFJPXYNGFXBYQXCBHXCBSXTYZDM#YSNXSXLHKMZXLTHDHKGHXXSSHQYHHCJYXGLHZXCSNHEKDTGQXQYPKDHEQTYKCNYMYYYPKQYYTJXZLTHHQTBYQHXBMYHSQCKWWYLLHCYYLNNEQXQWMCFBDCCMLJGGXDQKTLXKGNQCDGZJWYJJLYHHQDTTNWCHHXCXWHESZJYDJCCDBQCDGDNYXZDHCQRXCBMZTQCBXWGQWYYBXHMBYMYKDYECMKKYAQYNGYCSLFYKKQGYSSQYSHJGJCNXKZYCXSBKYXHYYLCTYCXQTHYSMGSCPMMGCCCCCMTZTASMGQZJHKLOSJYLSWTMQSYQKDZLJQQYPLCYCLine truncated

web/app/components/workflow/block-selector/utils.ts

@@ -1,9 +1,9 @@
-import { pinyin } from 'pinyin-pro'
+import { providerInitials } from './provider-initials.generated'
 
 export function getProviderLetter(firstChar: string) {
-  const pinyinInitial = /[\u4E00-\u9FA5]/.test(firstChar)
-    ? pinyin(firstChar, { pattern: 'first', toneType: 'none' })[0]
-    : firstChar
+  const code = firstChar.charCodeAt(0)
+  const pinyinInitial =
+    code >= 0x4e00 && code <= 0x9fa5 ? providerInitials[code - 0x4e00] : firstChar
   const letter = (pinyinInitial || firstChar).toUpperCase()
 
   return /[A-Z]/.test(letter) ? letter : '#'

web/package.json

@@ -19,6 +19,7 @@
     "dev:vinext": "vinext dev",
     "gen-doc-paths": "node ./scripts/gen-doc-paths.ts && vp fmt types/doc-paths.ts",
     "gen-icons": "pnpm --filter @dify/iconify-collections generate",
+    "gen-provider-initials": "node ./scripts/generate-provider-initials.ts",
     "i18n:check": "node ./scripts/generate-i18n-types.ts --check && node ./scripts/check-i18n.js",
     "i18n:check-types": "node ./scripts/generate-i18n-types.ts --check",
     "i18n:generate-types": "node ./scripts/generate-i18n-types.ts",
@@ -110,7 +111,6 @@
     "next": "catalog:",
     "next-themes": "catalog:",
     "nuqs": "catalog:",
-    "pinyin-pro": "catalog:",
     "qrcode.react": "catalog:",
     "qs": "catalog:",
     "react": "catalog:",
@@ -181,6 +181,7 @@
     "code-inspector-plugin": "catalog:",
     "happy-dom": "catalog:",
     "i18next-resources-for-ts": "catalog:",
+    "pinyin-pro": "catalog:",
     "playwright": "catalog:",
     "postcss": "catalog:",
     "react-server-dom-webpack": "catalog:",

web/scripts/generate-provider-initials.ts

@@ -0,0 +1,45 @@
+import { readFile, writeFile } from 'node:fs/promises'
+import { pinyin } from 'pinyin-pro'
+import { format } from 'vite-plus/fmt'
+
+const output = new URL(
+  '../app/components/workflow/block-selector/provider-initials.generated.ts',
+  import.meta.url,
+)
+const metadata = await readFile(
+  new URL('../node_modules/pinyin-pro/package.json', import.meta.url),
+  'utf8',
+)
+const { version } = JSON.parse(metadata) as { version: string }
+const license = await readFile(
+  new URL('../node_modules/pinyin-pro/LICENSE', import.meta.url),
+  'utf8',
+)
+
+// Preserve the existing single-character grouping range and default readings.
+let initials = ''
+for (let code = 0x4e00; code <= 0x9fa5; code++) {
+  const character = String.fromCharCode(code)
+  const initial = (
+    pinyin(character, { pattern: 'first', toneType: 'none' })[0] || character
+  ).toUpperCase()
+  initials += /^[A-Z]$/.test(initial) ? initial : '#'
+}
+
+const source = `// Generated by pnpm --dir web gen-provider-initials. Do not edit.
+// Single-character initials derived from pinyin-pro ${version} (https://github.com/zh-lx/pinyin-pro).
+/*
+${license.trim()}
+*/
+
+// Indexed by UTF-16 code unit minus U+4E00, through U+9FA5 inclusive.
+export const providerInitials = ${JSON.stringify(initials)}
+`
+const result = await format(output.pathname, source, { singleQuote: true, semi: false })
+if (result.errors.length) throw new Error('Could not format provider initials')
+if (process.argv.includes('--check')) {
+  if ((await readFile(output, 'utf8')) !== result.code)
+    throw new Error('Provider initials are stale. Run pnpm --dir web gen-provider-initials.')
+} else {
+  await writeFile(output, result.code)
+}