PERF: Use fixed-height textarea in note form (#36650)

KrisKotlarek · web-flow · commit fdc213ab1164 · 2025-12-12T13:58:21.000+08:00
The ExpandingTextArea component uses the autosize library, which triggers expensive DOM measurements (scrollHeight calculations) on every keystroke. This causes layout thrashing, especially problematic in the review queue, where multiple textareas may be rendered. <img width="801" height="851" alt="Screenshot 2025-12-12 at 12 40 36 pm" src="https://github.com/user-attachments/assets/26d00693-e637-4c4a-8cde-6f91596139f5" />
diff --git a/frontend/discourse/app/components/reviewable-refresh/note-form.gjs b/frontend/discourse/app/components/reviewable-refresh/note-form.gjs
@@ -1,9 +1,8 @@
 import Component from "@glimmer/component";
-import { fn, hash } from "@ember/helper";
+import { hash } from "@ember/helper";
 import { action } from "@ember/object";
 import { service } from "@ember/service";
 import { isEmpty } from "@ember/utils";
-import ExpandingTextArea from "discourse/components/expanding-text-area";
 import Form from "discourse/components/form";
 import PluginOutlet from "discourse/components/plugin-outlet";
 import lazyHash from "discourse/helpers/lazy-hash";
@@ -102,16 +101,11 @@ export default class ReviewableNoteForm extends Component {
           as |field|
         >
           <div class="reviewable-note-form__textarea-wrapper">
-            <field.Custom>
-              <ExpandingTextArea
-                @value={{field.value}}
-                @input={{fn this.handleInput field.set}}
-                @name={{field.name}}
-                placeholder={{i18n "review.notes.placeholder"}}
-                class="reviewable-note-form__textarea"
-                rows="1"
-              />
-            </field.Custom>
+            <field.Textarea
+              @height={{80}}
+              placeholder={{i18n "review.notes.placeholder"}}
+              class="reviewable-note-form__textarea"
+            />
             <PluginOutlet
               @name="reviewable-note-form-after-note"
               @connectorTagName="div"
