jsx-eslint/eslint-plugin-react

Rule proposal: no layout thrashing

Open

#1.889 aberto em 20 de jul. de 2018

Ver no GitHub
 (1 comment) (1 reaction) (0 assignees)JavaScript (2.797 forks)batch import
acceptedhelp wantednew rule

Métricas do repositório

Stars
 (8.630 stars)
Métricas de merge de PR
 (Nenhuma PRs mesclada em 30d)

Description

I've seen a lot of seemingly simple code lead to layout thrashing and performance problems that could have been statically detected and avoided. It would be nice to have a rule that could flag some of these scenarios.

I think it might make sense to take Paul Irish's list of what causes layout/reflow, and write a rule that flags when these happen synchronously in places like componentDidMount, render, and componentWillReceiveProps, etc.

Example:

class Foo extends React.Component {
  constructor(props) {
    super(props);

    this.state = {
      windowHeight: window.innerHeight, // <-- this forces layout
    };
  }
  // ...
}

Thoughts?

Guia do colaborador

Direção de pesquisa
Estude a lista de propriedades de layout thrashing de Paul Irish, identifique padrões comuns em métodos de ciclo de vida do React e implemente uma regra ESLint que sinalize leituras/escritas de layout síncronas em hooks e métodos de ciclo de vida apropriados.
Pilha de tecnologia
javascriptreact
Domain
frontend
Tipo Issue
Funcionalidade
DifficultyDificuldade de implementação estimada para um novo contribuidor, de 1 para alterações muito pequenas a 5 para trabalho de nível especializado.
3
Tempo estimadoUm intervalo de tempo aproximado para um colaborador experiente investigar, implementar, testar e preparar um pull request.
1-2 dias
Status da atividadeQuão disponível o issue aparece agora: novo, ativo, obsoleto, bloqueado ou aguardando entrada do mantenedor.
Antigo
ClarityCom que clareza o issue explica a mudança esperada, os critérios de aceitação e a próxima etapa.
Claro
Prerequisites
JavaScriptReact
Simpatia para novatosUma pontuação de 1 a 100 que estima o quão acessível este issue é para colaboradores iniciantes.
40