Battle against slow startup time

Seems like Intl and tinyld could be the cause
This commit is contained in:
Lim Chee Aun 2024-09-16 17:39:06 +08:00
parent 572358f0f4
commit 4ae1c38269
6 changed files with 107 additions and 98 deletions

View file

@ -16,7 +16,7 @@ import {
} from 'preact/hooks'; } from 'preact/hooks';
import { useHotkeys } from 'react-hotkeys-hook'; import { useHotkeys } from 'react-hotkeys-hook';
import stringLength from 'string-length'; import stringLength from 'string-length';
import { detectAll } from 'tinyld/light'; // import { detectAll } from 'tinyld/light';
import { uid } from 'uid/single'; import { uid } from 'uid/single';
import { useDebouncedCallback, useThrottledCallback } from 'use-debounce'; import { useDebouncedCallback, useThrottledCallback } from 'use-debounce';
import { useSnapshot } from 'valtio'; import { useSnapshot } from 'valtio';
@ -1169,11 +1169,12 @@ function Compose({
<option value="public"> <option value="public">
<Trans>Public</Trans> <Trans>Public</Trans>
</option> </option>
{(supports('@pleroma/local-visibility-post') || supports('@akkoma/local-visibility-post')) && {(supports('@pleroma/local-visibility-post') ||
supports('@akkoma/local-visibility-post')) && (
<option value="local"> <option value="local">
<Trans>Local</Trans> <Trans>Local</Trans>
</option> </option>
} )}
<option value="unlisted"> <option value="unlisted">
<Trans>Unlisted</Trans> <Trans>Unlisted</Trans>
</option> </option>
@ -1673,7 +1674,8 @@ const getCustomEmojis = pmem(_getCustomEmojis, {
maxAge: 30 * 60 * 1000, // 30 minutes maxAge: 30 * 60 * 1000, // 30 minutes
}); });
const detectLangs = (text) => { const detectLangs = async (text) => {
const { detectAll } = await import('tinyld/light');
const langs = detectAll(text); const langs = detectAll(text);
if (langs?.length) { if (langs?.length) {
// return max 2 // return max 2
@ -1963,13 +1965,15 @@ const Textarea = forwardRef((props, ref) => {
}); });
const text = dom.innerText?.trim(); const text = dom.innerText?.trim();
if (!text) return; if (!text) return;
const langs = detectLangs(text); (async () => {
const langs = await detectLangs(text);
if (langs?.length) { if (langs?.length) {
onTrigger?.({ onTrigger?.({
name: 'auto-detect-language', name: 'auto-detect-language',
languages: langs, languages: langs,
}); });
} }
})();
}, 2000); }, 2000);
return ( return (

View file

@ -14,10 +14,12 @@ function isValidDate(value) {
} }
} }
const resolvedLocale = new Intl.DateTimeFormat().resolvedOptions().locale; const resolvedLocale = mem(
() => new Intl.DateTimeFormat().resolvedOptions().locale,
);
const DTF = mem((locale, opts = {}) => { const DTF = mem((locale, opts = {}) => {
const regionlessLocale = locale.replace(/-[a-z]+$/i, ''); const regionlessLocale = locale.replace(/-[a-z]+$/i, '');
const lang = localeMatch([regionlessLocale], [resolvedLocale], locale); const lang = localeMatch([regionlessLocale], [resolvedLocale()], locale);
try { try {
return new Intl.DateTimeFormat(lang, opts); return new Intl.DateTimeFormat(lang, opts);
} catch (e) {} } catch (e) {}

View file

@ -26,7 +26,7 @@ import {
} from 'preact/hooks'; } from 'preact/hooks';
import punycode from 'punycode/'; import punycode from 'punycode/';
import { useHotkeys } from 'react-hotkeys-hook'; import { useHotkeys } from 'react-hotkeys-hook';
import { detectAll } from 'tinyld/light'; // import { detectAll } from 'tinyld/light';
import { useLongPress } from 'use-long-press'; import { useLongPress } from 'use-long-press';
import { useSnapshot } from 'valtio'; import { useSnapshot } from 'valtio';
@ -51,7 +51,6 @@ import htmlContentLength from '../utils/html-content-length';
import isRTL from '../utils/is-rtl'; import isRTL from '../utils/is-rtl';
import isMastodonLinkMaybe from '../utils/isMastodonLinkMaybe'; import isMastodonLinkMaybe from '../utils/isMastodonLinkMaybe';
import localeMatch from '../utils/locale-match'; import localeMatch from '../utils/locale-match';
import mem from '../utils/mem';
import niceDateTime from '../utils/nice-date-time'; import niceDateTime from '../utils/nice-date-time';
import openCompose from '../utils/open-compose'; import openCompose from '../utils/open-compose';
import pmem from '../utils/pmem'; import pmem from '../utils/pmem';
@ -168,7 +167,8 @@ const SIZE_CLASS = {
l: 'large', l: 'large',
}; };
const detectLang = mem((text) => { const detectLang = pmem(async (text) => {
const { detectAll } = await import('tinyld/light');
text = text?.trim(); text = text?.trim();
// Ref: https://github.com/komodojp/tinyld/blob/develop/docs/benchmark.md // Ref: https://github.com/komodojp/tinyld/blob/develop/docs/benchmark.md
@ -304,8 +304,8 @@ function Status({
if (!content) return; if (!content) return;
if (_language) return; if (_language) return;
let timer; let timer;
timer = setTimeout(() => { timer = setTimeout(async () => {
let detected = detectLang( let detected = await detectLang(
getHTMLText(content, { getHTMLText(content, {
preProcess: (dom) => { preProcess: (dom) => {
// Remove anything that can skew the language detection // Remove anything that can skew the language detection

152
src/locales/en.po generated
View file

@ -105,7 +105,7 @@ msgstr ""
#: src/components/account-info.jsx:427 #: src/components/account-info.jsx:427
#: src/components/account-info.jsx:1115 #: src/components/account-info.jsx:1115
#: src/components/compose.jsx:2459 #: src/components/compose.jsx:2463
#: src/components/media-alt-modal.jsx:45 #: src/components/media-alt-modal.jsx:45
#: src/components/media-modal.jsx:283 #: src/components/media-modal.jsx:283
#: src/components/status.jsx:1636 #: src/components/status.jsx:1636
@ -401,10 +401,10 @@ msgstr ""
#: src/components/account-info.jsx:2089 #: src/components/account-info.jsx:2089
#: src/components/account-sheet.jsx:37 #: src/components/account-sheet.jsx:37
#: src/components/compose.jsx:797 #: src/components/compose.jsx:797
#: src/components/compose.jsx:2415 #: src/components/compose.jsx:2419
#: src/components/compose.jsx:2888 #: src/components/compose.jsx:2892
#: src/components/compose.jsx:3096 #: src/components/compose.jsx:3100
#: src/components/compose.jsx:3326 #: src/components/compose.jsx:3330
#: src/components/drafts.jsx:58 #: src/components/drafts.jsx:58
#: src/components/embed-modal.jsx:12 #: src/components/embed-modal.jsx:12
#: src/components/generic-accounts.jsx:142 #: src/components/generic-accounts.jsx:142
@ -547,8 +547,8 @@ msgstr ""
#: src/components/compose.jsx:614 #: src/components/compose.jsx:614
#: src/components/compose.jsx:630 #: src/components/compose.jsx:630
#: src/components/compose.jsx:1336 #: src/components/compose.jsx:1337
#: src/components/compose.jsx:1597 #: src/components/compose.jsx:1598
msgid "{maxMediaAttachments, plural, one {You can only attach up to 1 file.} other {You can only attach up to # files.}}" msgid "{maxMediaAttachments, plural, one {You can only attach up to 1 file.} other {You can only attach up to # files.}}"
msgstr "" msgstr ""
@ -615,61 +615,61 @@ msgid "Content warning or sensitive media"
msgstr "" msgstr ""
#: src/components/compose.jsx:1170 #: src/components/compose.jsx:1170
#: src/components/status.jsx:93 #: src/components/status.jsx:92
#: src/pages/settings.jsx:297 #: src/pages/settings.jsx:297
msgid "Public" msgid "Public"
msgstr "" msgstr ""
#: src/components/compose.jsx:1174 #: src/components/compose.jsx:1175
#: src/components/nav-menu.jsx:386 #: src/components/nav-menu.jsx:386
#: src/components/shortcuts-settings.jsx:162 #: src/components/shortcuts-settings.jsx:162
#: src/components/status.jsx:94 #: src/components/status.jsx:93
msgid "Local" msgid "Local"
msgstr "" msgstr ""
#: src/components/compose.jsx:1178 #: src/components/compose.jsx:1179
#: src/components/status.jsx:95 #: src/components/status.jsx:94
#: src/pages/settings.jsx:300 #: src/pages/settings.jsx:300
msgid "Unlisted" msgid "Unlisted"
msgstr "" msgstr ""
#: src/components/compose.jsx:1181 #: src/components/compose.jsx:1182
#: src/components/status.jsx:96 #: src/components/status.jsx:95
#: src/pages/settings.jsx:303 #: src/pages/settings.jsx:303
msgid "Followers only" msgid "Followers only"
msgstr "" msgstr ""
#: src/components/compose.jsx:1184 #: src/components/compose.jsx:1185
#: src/components/status.jsx:97 #: src/components/status.jsx:96
#: src/components/status.jsx:1840 #: src/components/status.jsx:1840
msgid "Private mention" msgid "Private mention"
msgstr "" msgstr ""
#: src/components/compose.jsx:1193 #: src/components/compose.jsx:1194
msgid "Post your reply" msgid "Post your reply"
msgstr "" msgstr ""
#: src/components/compose.jsx:1195 #: src/components/compose.jsx:1196
msgid "Edit your post" msgid "Edit your post"
msgstr "" msgstr ""
#: src/components/compose.jsx:1196 #: src/components/compose.jsx:1197
msgid "What are you doing?" msgid "What are you doing?"
msgstr "" msgstr ""
#: src/components/compose.jsx:1274 #: src/components/compose.jsx:1275
msgid "Mark media as sensitive" msgid "Mark media as sensitive"
msgstr "" msgstr ""
#: src/components/compose.jsx:1372 #: src/components/compose.jsx:1373
msgid "Add poll" msgid "Add poll"
msgstr "" msgstr ""
#: src/components/compose.jsx:1394 #: src/components/compose.jsx:1395
msgid "Add custom emoji" msgid "Add custom emoji"
msgstr "" msgstr ""
#: src/components/compose.jsx:1478 #: src/components/compose.jsx:1479
#: src/components/keyboard-shortcuts-help.jsx:143 #: src/components/keyboard-shortcuts-help.jsx:143
#: src/components/status.jsx:831 #: src/components/status.jsx:831
#: src/components/status.jsx:1616 #: src/components/status.jsx:1616
@ -678,195 +678,195 @@ msgstr ""
msgid "Reply" msgid "Reply"
msgstr "" msgstr ""
#: src/components/compose.jsx:1480 #: src/components/compose.jsx:1481
msgid "Update" msgid "Update"
msgstr "" msgstr ""
#: src/components/compose.jsx:1481 #: src/components/compose.jsx:1482
msgctxt "Submit button in composer" msgctxt "Submit button in composer"
msgid "Post" msgid "Post"
msgstr "" msgstr ""
#: src/components/compose.jsx:1609 #: src/components/compose.jsx:1610
msgid "Downloading GIF…" msgid "Downloading GIF…"
msgstr "" msgstr ""
#: src/components/compose.jsx:1637 #: src/components/compose.jsx:1638
msgid "Failed to download GIF" msgid "Failed to download GIF"
msgstr "" msgstr ""
#: src/components/compose.jsx:1748 #: src/components/compose.jsx:1750
#: src/components/compose.jsx:1825 #: src/components/compose.jsx:1827
#: src/components/nav-menu.jsx:287 #: src/components/nav-menu.jsx:287
msgid "More…" msgid "More…"
msgstr "" msgstr ""
#: src/components/compose.jsx:2228 #: src/components/compose.jsx:2232
msgid "Uploaded" msgid "Uploaded"
msgstr "" msgstr ""
#: src/components/compose.jsx:2241 #: src/components/compose.jsx:2245
msgid "Image description" msgid "Image description"
msgstr "" msgstr ""
#: src/components/compose.jsx:2242 #: src/components/compose.jsx:2246
msgid "Video description" msgid "Video description"
msgstr "" msgstr ""
#: src/components/compose.jsx:2243 #: src/components/compose.jsx:2247
msgid "Audio description" msgid "Audio description"
msgstr "" msgstr ""
#: src/components/compose.jsx:2279 #: src/components/compose.jsx:2283
#: src/components/compose.jsx:2299 #: src/components/compose.jsx:2303
msgid "File size too large. Uploading might encounter issues. Try reduce the file size from {0} to {1} or lower." msgid "File size too large. Uploading might encounter issues. Try reduce the file size from {0} to {1} or lower."
msgstr "" msgstr ""
#: src/components/compose.jsx:2291 #: src/components/compose.jsx:2295
#: src/components/compose.jsx:2311 #: src/components/compose.jsx:2315
msgid "Dimension too large. Uploading might encounter issues. Try reduce dimension from {0}×{1}px to {2}×{3}px." msgid "Dimension too large. Uploading might encounter issues. Try reduce dimension from {0}×{1}px to {2}×{3}px."
msgstr "" msgstr ""
#: src/components/compose.jsx:2319 #: src/components/compose.jsx:2323
msgid "Frame rate too high. Uploading might encounter issues." msgid "Frame rate too high. Uploading might encounter issues."
msgstr "" msgstr ""
#: src/components/compose.jsx:2379 #: src/components/compose.jsx:2383
#: src/components/compose.jsx:2629 #: src/components/compose.jsx:2633
#: src/components/shortcuts-settings.jsx:723 #: src/components/shortcuts-settings.jsx:723
#: src/pages/catchup.jsx:1074 #: src/pages/catchup.jsx:1074
#: src/pages/filters.jsx:412 #: src/pages/filters.jsx:412
msgid "Remove" msgid "Remove"
msgstr "" msgstr ""
#: src/components/compose.jsx:2396 #: src/components/compose.jsx:2400
#: src/compose.jsx:83 #: src/compose.jsx:83
msgid "Error" msgid "Error"
msgstr "" msgstr ""
#: src/components/compose.jsx:2421 #: src/components/compose.jsx:2425
msgid "Edit image description" msgid "Edit image description"
msgstr "" msgstr ""
#: src/components/compose.jsx:2422 #: src/components/compose.jsx:2426
msgid "Edit video description" msgid "Edit video description"
msgstr "" msgstr ""
#: src/components/compose.jsx:2423 #: src/components/compose.jsx:2427
msgid "Edit audio description" msgid "Edit audio description"
msgstr "" msgstr ""
#: src/components/compose.jsx:2468 #: src/components/compose.jsx:2472
#: src/components/compose.jsx:2517 #: src/components/compose.jsx:2521
msgid "Generating description. Please wait…" msgid "Generating description. Please wait…"
msgstr "" msgstr ""
#: src/components/compose.jsx:2488 #: src/components/compose.jsx:2492
msgid "Failed to generate description: {0}" msgid "Failed to generate description: {0}"
msgstr "" msgstr ""
#: src/components/compose.jsx:2489 #: src/components/compose.jsx:2493
msgid "Failed to generate description" msgid "Failed to generate description"
msgstr "" msgstr ""
#: src/components/compose.jsx:2501 #: src/components/compose.jsx:2505
#: src/components/compose.jsx:2507 #: src/components/compose.jsx:2511
#: src/components/compose.jsx:2553 #: src/components/compose.jsx:2557
msgid "Generate description…" msgid "Generate description…"
msgstr "" msgstr ""
#: src/components/compose.jsx:2540 #: src/components/compose.jsx:2544
msgid "Failed to generate description{0}" msgid "Failed to generate description{0}"
msgstr "" msgstr ""
#: src/components/compose.jsx:2555 #: src/components/compose.jsx:2559
msgid "({0}) <0>— experimental</0>" msgid "({0}) <0>— experimental</0>"
msgstr "" msgstr ""
#: src/components/compose.jsx:2574 #: src/components/compose.jsx:2578
msgid "Done" msgid "Done"
msgstr "" msgstr ""
#: src/components/compose.jsx:2610 #: src/components/compose.jsx:2614
msgid "Choice {0}" msgid "Choice {0}"
msgstr "" msgstr ""
#: src/components/compose.jsx:2657 #: src/components/compose.jsx:2661
msgid "Multiple choices" msgid "Multiple choices"
msgstr "" msgstr ""
#: src/components/compose.jsx:2660 #: src/components/compose.jsx:2664
msgid "Duration" msgid "Duration"
msgstr "" msgstr ""
#: src/components/compose.jsx:2691 #: src/components/compose.jsx:2695
msgid "Remove poll" msgid "Remove poll"
msgstr "" msgstr ""
#: src/components/compose.jsx:2905 #: src/components/compose.jsx:2909
msgid "Search accounts" msgid "Search accounts"
msgstr "" msgstr ""
#: src/components/compose.jsx:2946 #: src/components/compose.jsx:2950
#: src/components/shortcuts-settings.jsx:712 #: src/components/shortcuts-settings.jsx:712
#: src/pages/list.jsx:359 #: src/pages/list.jsx:359
msgid "Add" msgid "Add"
msgstr "" msgstr ""
#: src/components/compose.jsx:2959 #: src/components/compose.jsx:2963
#: src/components/generic-accounts.jsx:227 #: src/components/generic-accounts.jsx:227
msgid "Error loading accounts" msgid "Error loading accounts"
msgstr "" msgstr ""
#: src/components/compose.jsx:3102 #: src/components/compose.jsx:3106
msgid "Custom emojis" msgid "Custom emojis"
msgstr "" msgstr ""
#: src/components/compose.jsx:3122 #: src/components/compose.jsx:3126
msgid "Search emoji" msgid "Search emoji"
msgstr "" msgstr ""
#: src/components/compose.jsx:3153 #: src/components/compose.jsx:3157
msgid "Error loading custom emojis" msgid "Error loading custom emojis"
msgstr "" msgstr ""
#: src/components/compose.jsx:3164 #: src/components/compose.jsx:3168
msgid "Recently used" msgid "Recently used"
msgstr "" msgstr ""
#: src/components/compose.jsx:3165 #: src/components/compose.jsx:3169
msgid "Others" msgid "Others"
msgstr "" msgstr ""
#: src/components/compose.jsx:3203 #: src/components/compose.jsx:3207
msgid "{0} more…" msgid "{0} more…"
msgstr "" msgstr ""
#: src/components/compose.jsx:3341 #: src/components/compose.jsx:3345
msgid "Search GIFs" msgid "Search GIFs"
msgstr "" msgstr ""
#: src/components/compose.jsx:3356 #: src/components/compose.jsx:3360
msgid "Powered by GIPHY" msgid "Powered by GIPHY"
msgstr "" msgstr ""
#: src/components/compose.jsx:3364 #: src/components/compose.jsx:3368
msgid "Type to search GIFs" msgid "Type to search GIFs"
msgstr "" msgstr ""
#: src/components/compose.jsx:3462 #: src/components/compose.jsx:3466
#: src/components/media-modal.jsx:387 #: src/components/media-modal.jsx:387
#: src/components/timeline.jsx:889 #: src/components/timeline.jsx:889
msgid "Previous" msgid "Previous"
msgstr "" msgstr ""
#: src/components/compose.jsx:3480 #: src/components/compose.jsx:3484
#: src/components/media-modal.jsx:406 #: src/components/media-modal.jsx:406
#: src/components/timeline.jsx:906 #: src/components/timeline.jsx:906
msgid "Next" msgid "Next"
msgstr "" msgstr ""
#: src/components/compose.jsx:3497 #: src/components/compose.jsx:3501
msgid "Error loading GIFs" msgid "Error loading GIFs"
msgstr "" msgstr ""
@ -1571,17 +1571,17 @@ msgid "Ending"
msgstr "" msgstr ""
#. Relative time in seconds, as short as possible #. Relative time in seconds, as short as possible
#: src/components/relative-time.jsx:55 #: src/components/relative-time.jsx:57
msgid "{0}s" msgid "{0}s"
msgstr "" msgstr ""
#. Relative time in minutes, as short as possible #. Relative time in minutes, as short as possible
#: src/components/relative-time.jsx:60 #: src/components/relative-time.jsx:62
msgid "{0}m" msgid "{0}m"
msgstr "" msgstr ""
#. Relative time in hours, as short as possible #. Relative time in hours, as short as possible
#: src/components/relative-time.jsx:65 #: src/components/relative-time.jsx:67
msgid "{0}h" msgid "{0}h"
msgstr "" msgstr ""

View file

@ -1,16 +1,17 @@
import translationTargetLanguages from '../data/lingva-target-languages'; import translationTargetLanguages from '../data/lingva-target-languages';
import localeMatch from './locale-match'; import localeMatch from './locale-match';
import mem from './mem';
import states from './states'; import states from './states';
const locales = [ const locales = mem(() => [
new Intl.DateTimeFormat().resolvedOptions().locale, new Intl.DateTimeFormat().resolvedOptions().locale,
...navigator.languages, ...navigator.languages,
]; ]);
const localeTargetLanguages = () => const localeTargetLanguages = () =>
localeMatch( localeMatch(
locales, locales(),
translationTargetLanguages.map((l) => l.code.replace('_', '-')), // The underscore will fail Intl.Locale inside `match` translationTargetLanguages.map((l) => l.code.replace('_', '-')), // The underscore will fail Intl.Locale inside `match`
'en', 'en',
); );

View file

@ -3,7 +3,9 @@ import { i18n } from '@lingui/core';
import localeMatch from './locale-match'; import localeMatch from './locale-match';
import mem from './mem'; import mem from './mem';
const defaultLocale = new Intl.DateTimeFormat().resolvedOptions().locale; const defaultLocale = mem(
() => new Intl.DateTimeFormat().resolvedOptions().locale,
);
const _DateTimeFormat = (opts) => { const _DateTimeFormat = (opts) => {
const { locale, dateYear, hideTime, formatOpts } = opts || {}; const { locale, dateYear, hideTime, formatOpts } = opts || {};