Elemar DEV

Negócios, tecnologia e desenvolvimento

Melhorando a responsividade da interface com Reactive Extensions

Olá!

Estou escrevendo um compilador para uma DSL externa. Visando testar o “tokenizer”, criei uma aplicação playground simples, com um editor RTF, onde faço highlighting do código na medida em que ele é informado.

O problema é que não queria disparar o processo a cada pequena modificação. Faria mais sentido esperar uma “pausa” do usuário. Como implementar? Usando Reactive Extensions.

var shouldHighlight =  Observable
    .FromEventPattern<TextChangedEventArgs>(SourceRichTextBox, "TextChanged")
    .Throttle(TimeSpan.FromMilliseconds(500))
    .Select(e => new TextRange(
        SourceRichTextBox.Document.ContentStart, 
        SourceRichTextBox.Document.ContentEnd).Text
        )
    .DistinctUntilChanged();

shouldHighlight
    .ObserveOnDispatcher()
    .Subscribe(e => HighlightCode());

Na configuração, crio um “Observable” a partir do evento “TextChanged” do meu componente RTF. Em seguida, indico que quero um período mínimo de 500ms entre uma ocorrência e outra. Por fim, descarto ocorrências onde não houver mudança do conteúdo.

3 comentários em “Melhorando a responsividade da interface com Reactive Extensions

  1. acazsouza
    11/02/2016

    Hmmmm… acho que é isso que os frameworks js, ReactJs principalmente usam pra dar update no DOM, eles dão updates de tempos em tempos, pegando da fila de mudanças, em vez de meter o dedo no DOM a cada modificação… muito legal. Se não me engano, o AngularJs novo também funciona assim, dizem que fica muito bom!!! Abraços!!

  2. Francisco Berrocal
    11/02/2016

    Sensacional como o exemplo é simples, mas útil! Parabéns!

  3. Francisco Berrocal
    12/02/2016

    Fiquei interessado no DSL! Alguma intenção de abrir o código fonte?

Deixe um comentário

Informação

Publicado às 11/02/2016 por em Post e marcado .

Estatísticas

  • 921.504 hits