82d7747 · crush · git.iko.soy

git.iko.soy/crush

Improve TUI performance with Bubbletea v2 event filtering

- Use tea.WithMouseCellMotion instead of WithMouseAllMotion to reduce event flooding - Add MouseEventFilter to filter mouse wheel/motion events when editor is focused - Implement debounced completion filtering (150ms) to reduce overhead during fast typing - Add proper timer cleanup when editor loses focus - Remove unnecessary ChatFocusedMsg handling since filter checks focus state directly This eliminates typing lag caused by mouse scroll events while maintaining mouse functionality for navigation.

commit82d774709919cc7bc4df972bbef9ddf892347848 authorRaphael Amorim <rapha850@gmail.com> dateTue 8 Jul 2025, 18:40 (1 year ago) parent7226a61

4 files changed+75−9

compare with main

unifiedsplit

cmd/root.go+2 internal/tui/components/chat/editor/editor.go+44−6 internal/tui/page/chat/chat.go+6 internal/tui/tui.go+23−3

cmd/root.go+2

@@ -120,6 +120,8 @@ to assist developers in writing, debugging, and understanding code directly from

120120 tea.WithAltScreen(),

121121 tea.WithKeyReleases(),

122122 tea.WithUniformKeyLayout(),

123+ tea.WithMouseCellMotion(), // Use cell motion instead of all motion to reduce event flooding

124+ tea.WithFilter(tui.MouseEventFilter), // Filter mouse events based on focus state

123125 )

124126

125127 // Setup the subscriptions, this will send services events to the TUI

internal/tui/components/chat/editor/editor.go+44−6

@@ -7,6 +7,7 @@ import (

77 "runtime"

88 "slices"

99 "strings"

10+ "time"

1011 "unicode"

1112

1213 "github.com/charmbracelet/bubbles/v2/key"

@@ -30,6 +31,8 @@ type FileCompletionItem struct {

3031 Path string // The file path

3132}

3233

34+type CompletionDebounceMsg struct{}

35+

3336type editorCmp struct {

3437 width int

3538 height int

@@ -46,6 +49,9 @@ type editorCmp struct {

4649 currentQuery string

4750 completionsStartIndex int

4851 isCompletionsOpen bool

52+

53+ // Debouncing for completions

54+ debounceTimer *time.Timer

4955}

5056

5157var DeleteKeyMaps = DeleteAttachmentKeyMaps{

@@ -141,6 +147,22 @@ func (m *editorCmp) send() tea.Cmd {

141147 )

142148}

143149

150+// debouncedCompletionFilter creates a debounced command for filtering completions

151+func (m *editorCmp) debouncedCompletionFilter() tea.Cmd {

152+ // Cancel existing timer if any

153+ if m.debounceTimer != nil {

154+ m.debounceTimer.Stop()

155+ }

156+

157+ // Create new timer for debouncing

158+ m.debounceTimer = time.NewTimer(150 * time.Millisecond)

159+

160+ return func() tea.Msg {

161+ <-m.debounceTimer.C

162+ return CompletionDebounceMsg{}

163+ }

164+}

165+

144166func (m *editorCmp) Update(msg tea.Msg) (tea.Model, tea.Cmd) {

145167 var cmd tea.Cmd

146168 var cmds []tea.Cmd

@@ -160,6 +182,18 @@ func (m *editorCmp) Update(msg tea.Msg) (tea.Model, tea.Cmd) {

160182 m.isCompletionsOpen = false

161183 m.currentQuery = ""

162184 m.completionsStartIndex = 0

185+ // Cancel any pending debounce timer

186+ if m.debounceTimer != nil {

187+ m.debounceTimer.Stop()

188+ m.debounceTimer = nil

189+ }

190+ case CompletionDebounceMsg:

191+ // Handle debounced completion filtering

192+ if m.isCompletionsOpen {

193+ return m, util.CmdHandler(completions.FilterCompletionsMsg{

194+ Query: m.currentQuery,

195+ })

196+ }

163197 case completions.SelectCompletionMsg:

164198 if !m.isCompletionsOpen {

165199 return m, nil

@@ -196,9 +230,8 @@ func (m *editorCmp) Update(msg tea.Msg) (tea.Model, tea.Cmd) {

196230 case msg.String() == "backspace" && m.isCompletionsOpen:

197231 if len(m.currentQuery) > 0 {

198232 m.currentQuery = m.currentQuery[:len(m.currentQuery)-1]

199− cmds = append(cmds, util.CmdHandler(completions.FilterCompletionsMsg{

200− Query: m.currentQuery,

201− }))

233+ // Use debounced filtering instead of immediate filtering

234+ cmds = append(cmds, m.debouncedCompletionFilter())

202235 } else {

203236 m.isCompletionsOpen = false

204237 m.currentQuery = ""

@@ -208,9 +241,8 @@ func (m *editorCmp) Update(msg tea.Msg) (tea.Model, tea.Cmd) {

208241 default:

209242 if m.isCompletionsOpen {

210243 m.currentQuery += msg.String()

211− cmds = append(cmds, util.CmdHandler(completions.FilterCompletionsMsg{

212− Query: m.currentQuery,

213− }))

244+ // Use debounced filtering instead of immediate filtering

245+ cmds = append(cmds, m.debouncedCompletionFilter())

214246 }

215247 }

216248 if key.Matches(msg, DeleteKeyMaps.AttachmentDeleteMode) {

@@ -258,6 +290,7 @@ func (m *editorCmp) Update(msg tea.Msg) (tea.Model, tea.Cmd) {

258290 }

259291 }

260292 }

293+

261294 m.textarea, cmd = m.textarea.Update(msg)

262295 cmds = append(cmds, cmd)

263296 return m, tea.Batch(cmds...)

@@ -355,6 +388,11 @@ func (m *editorCmp) startCompletions() tea.Msg {

355388// Blur implements Container.

356389func (c *editorCmp) Blur() tea.Cmd {

357390 c.textarea.Blur()

391+ // Clean up debounce timer when losing focus

392+ if c.debounceTimer != nil {

393+ c.debounceTimer.Stop()

394+ c.debounceTimer = nil

395+ }

358396 return nil

359397}

360398

internal/tui/page/chat/chat.go+6

@@ -39,6 +39,7 @@ type (

3939type ChatPage interface {

4040 util.Model

4141 layout.Help

42+ IsChatFocused() bool

4243}

4344

4445type chatPage struct {

@@ -415,3 +416,8 @@ func NewChatPage(app *app.App) ChatPage {

415416 header: header.New(app.LSPClients),

416417 }

417418}

419+

420+// IsChatFocused returns whether the chat messages are focused (true) or editor is focused (false)

421+func (p *chatPage) IsChatFocused() bool {

422+ return p.chatFocused

423+}

internal/tui/tui.go+23−3

@@ -31,6 +31,29 @@ import (

3131 "github.com/charmbracelet/lipgloss/v2"

3232)

3333

34+// MouseEventFilter filters mouse events based on the current focus state

35+// This is used with tea.WithFilter to prevent mouse scroll events from

36+// interfering with typing performance in the editor

37+func MouseEventFilter(m tea.Model, msg tea.Msg) tea.Msg {

38+ // Only filter mouse events

39+ switch msg.(type) {

40+ case tea.MouseWheelMsg, tea.MouseMotionMsg:

41+ // Check if we have an appModel and if editor is focused

42+ if appModel, ok := m.(*appModel); ok {

43+ if appModel.currentPage == chat.ChatPageID {

44+ if chatPage, ok := appModel.pages[appModel.currentPage].(chat.ChatPage); ok {

45+ // If editor is focused (not chatFocused), filter out mouse wheel/motion events

46+ if !chatPage.IsChatFocused() {

47+ return nil // Filter out the event

48+ }

49+ }

50+ }

51+ }

52+ }

53+ // Allow all other events to pass through

54+ return msg

55+}

56+

3457// appModel represents the main application model that manages pages, dialogs, and UI state.

3558type appModel struct {

3659 wWidth, wHeight int // Window dimensions

@@ -82,9 +105,6 @@ func (a appModel) Init() tea.Cmd {

82105 return nil

83106 })

84107

85− // Enable mouse support.

86− cmds = append(cmds, tea.EnableMouseAllMotion)

87−

88108 return tea.Batch(cmds...)

89109}

90110