Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

enhance(frontend): ノートをたたむ基準を仮想行数から算定するように #13761

Draft
wants to merge 4 commits into
base: develop
Choose a base branch
from

Conversation

kakkokari-gtyih
Copy link
Contributor

What

MFMのASTを用いて、横の文字数のしきい値を基準にして仮想の行数を算出し、それが行数のしきい値を超えるか超えないかでノートをたたむ基準を判定するように

Why

Fix #13266 (あくまで一つの案です)

Additional info (optional)

クライアントの高さを測るのとどっちのほうがパフォーマンス良いかはわからない(畳まれる基準が横幅によらず統一されるという意味ではこちらのほうが良い気もするけど)

Checklist

  • Read the contribution guide
  • Test working in a local environment
  • (If needed) Add story of storybook
  • (If needed) Update CHANGELOG.md
  • (If possible) Add tests

@github-actions github-actions bot added the packages/frontend Client side specific issue/PR label Apr 28, 2024
Copy link

codecov bot commented Apr 28, 2024

Codecov Report

Attention: Patch coverage is 5.33981% with 195 lines in your changes are missing coverage. Please review.

Project coverage is 77.37%. Comparing base (e2ff5f5) to head (b0fe6ea).

Files Patch % Lines
packages/frontend/src/scripts/collapsed.ts 1.51% 195 Missing ⚠️
Additional details and impacted files
@@             Coverage Diff             @@
##           develop   #13761      +/-   ##
===========================================
- Coverage    77.92%   77.37%   -0.55%     
===========================================
  Files          185      185              
  Lines        25535    25724     +189     
  Branches       487      487              
===========================================
+ Hits         19897    19903       +6     
- Misses        5631     5814     +183     
  Partials         7        7              

☔ View full report in Codecov by Sentry.
📢 Have feedback on the report? Share it here.

@kakkokari-gtyih kakkokari-gtyih marked this pull request as draft April 28, 2024 12:21
@kakkokari-gtyih kakkokari-gtyih marked this pull request as ready for review April 28, 2024 12:21
@anatawa12
Copy link
Member

(畳まれる基準が横幅によらず統一されるという意味ではこちらのほうが良い気もするけど)

横幅に応じてほしい気持ちが私はあります。

// 半角は1、全角は2として文字数をカウント
// https://zenn.dev/terrierscript/articles/2020-09-19-multibyte-count
function getCharCount(str: string): number {
return str.split('').reduce((count, char) => count + Math.min(new Blob([char]).size, 2), 0);
Copy link
Member

@anatawa12 anatawa12 Apr 28, 2024

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

🇺🇸 が全角2文字や 👨🏻‍🦱 が全角7文字とされたり î が 全角扱いされる問題がありそう

🇺🇸 はサロゲートペアな '🇺'と'🇸' の結合文字で、split('')だとサロゲートペアが分割されるため4文字に分割され、non-asciiなので2バイト文字扱いされる

一応正しく見ようとすると書記素分割してeast asian widthをみるだけどデータがクソデカという問題は発生する。

最低限書記素分割にするのとLatin-1が全角扱い受けるのはどうにかしたい気がする

あと現行の実装のままにする場合もnew Blobが本当に早いのかが少し疑問。'i'.charCodeAt(0) < 127 ? 1 : 2と同じだと思うのだけどこっちのほうが早かったりしないかな

Copy link
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

最低限書記素分割にする

[...new Intl.Segmenter(viewerLocale).segment(str)].reduce((count, segment) => count + hoge(segment), 0) でできそう(?)

east asian width

かなり微妙なハックだがcanvas要素を悪用する手があるらしい:

表示上の幅を測る場合 canvas の measureText があります。
フォントに依存してしまう、絵文字の幅がおかしい?などの注意点はあるもののピクセル単位で計測できるのは便利そうです。

-- https://zenn.dev/rithmety/articles/20220302-unicode-width-ce9e18da11ac9e

@kakkokari-gtyih kakkokari-gtyih marked this pull request as draft April 29, 2024 01:19
@FineArchs
Copy link
Contributor

(畳まれる基準が横幅によらず統一されるという意味ではこちらのほうが良い気もするけど)

横幅に応じてほしい気持ちが私はあります。

完全にレスポンシブにすると統一基準として役立たなくなってしまいますが、PCとスマホの2パターンに大別するくらいはやってもよさそうな気がします

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
packages/frontend Client side specific issue/PR
Projects
None yet
Development

Successfully merging this pull request may close these issues.

feat(frontend): ノートを畳むときの計算をレンダーしたときの高さ基準にする
4 participants