RelevantLatestTop

Mariana Xavier

5d atrás

Como obter o índice de um elemento dentro do seu nó pai sem usar looping explícito em JavaScript

#javascript#performance#dom

7 reações5 comentários

6 min de leitura

Vivian LimaMuito útil essa abordagem. Em projetos grandes, evitar loops pesados faz diferença na performance, principalmente em eventos que manipulam muitos elementos.

Nicolas CamposNo meu time, a gente costuma fazer isso em funções utilitárias que já consideram esses detalhes. Assim, evita bugs em projetos grandes.

Ver todos os 5 comentários →

Daniel Oliveira

6d atrás

Contando elementos irmãos em JavaScript sem usar loop explícito

#javascript#performance#dom

9 reações3 comentários

7 min de leitura

Igor TeixeiraConcordo, a filtragem por children é bem prática pra evitar nós de texto e comentários. Tenho usado bastante em componentes React pra evitar pegadinha na hora de manipular listas.

Leandro VieiraNo meu time, a maior dor é justamente quando o DOM vira uma sopa de nós de texto e comentários. Nesse caso, a filtragem com children evita surpresas na hora de calcular o índice.

Ver todos os 3 comentários →

Daniel Santana

30 de set.

Como implementar toggle de classes no HTML com JavaScript usando hover sem riscos de rollback

#javascript#dom#hover

11 reações4 comentários

6 min de leitura

Bruno EstevesBoa, essa abordagem é prática e evita o risco de ficar com o elemento preso em um estado errado. Já passei por problemas com toggle na hora de montar efeitos mais complexos, aí usa

Gabriela OliveiraConcordo. Acho que o ponto mais importante é cuidar para que o CSS esteja preparado para essas classes, pra evitar efeitos visuais inconsistentes. E, claro, testar em diferentes na

Ver todos os 4 comentários →

Igor Freitas

30 de set.

Identificar o índice de um elemento dentro do seu nó pai sem percorrer toda a lista de irmãos

#javascript#performance#dom

6 reações4 comentários

6 min de leitura

Gabriela SantanaNo meu time, evitamos usar muito esse método de busca em operações críticas, preferimos estruturar o DOM de modo que o índice seja conhecido na hora da manipulação. Assim, evitamos

Nicolas Nogueirajavascript e migração gradual precisam aparecer nessa conta

Ver todos os 4 comentários →

Nicolas Xavier

28 de set.

Controle de classes em elementos HTML ao passar o mouse usando JavaScript puro

#javascript#dom#interação

12 reações4 comentários

6 min de leitura

Leandro NogueiraBoa, mas cuidado com a troca de classes em eventos que podem disparar várias vezes por segundo, pode impactar na performance se não for bem controlado.

Camila PereiraJá passei por isso, usar transições CSS ajuda bastante a suavizar a troca e diminuir o impacto visual. Além disso, validar se as classes existem evita bugs na hora da renderização.

Ver todos os 4 comentários →

Mariana Ramos

24 de set.

Riscos e boas práticas ao usar innerHTML para manipular conteúdo dinâmico em elementos HTML

#javascript#seguranca#dom

8 reações4 comentários

6 min de leitura

Ana BarrosConcordo plenamente, especialmente na parte de sanitização. Uma má prática comum é esquecer de validar o conteúdo externo antes de inserir no DOM, o que pode abrir brechas sérias.

Mariana FreitasSim, e na minha experiência, usar insertAdjacentHTML com uma sanitização adequada ajudou pra cacete. O desempenho melhora e a vulnerabilidade diminui muito.

Ver todos os 4 comentários →

Elisa Nogueira

23 de set.

Gerenciamento de conteúdo dinâmico em elementos HTML usando JavaScript

#javascript#ajax#dom

13 reações4 comentários

7 min de leitura

Gabriela PereiraConcordo, Bruno. Aqui no meu time, usamos uma lib de saanitização antes de inserir o conteúdo, principalmente se vem de fontes externas. Assim, evitamos vulnerabilidades. Boa dica

Bruno NogueiraExcelente ponto, usar insertAdjacentHTML é muito mais performático. Mas tenho receio com segurança ao inserir HTML direto. Como vocês costumam fazer essa sanitização?

Ver todos os 4 comentários →

Mariana Dantas

21 de set.

Manipulação de texto em HTML sem usar innerHTML Riscos e alternativas práticas

#javascript#seguranca#dom

10 reações4 comentários

8 min de leitura

Bruno AlmeidaNo meu time, a gente sempre usa textContent pra mudanças simples assim. Evita muita dor de cabeça com segurança. manda um ae

Mariana SantanaExato, e o mais importante é remover os nós antigos pra cuidar para que o conteúdo antigo não fique residual. Usar while com firstChild é uma boa dica.

Ver todos os 4 comentários →

Bruno Pereira

19 de set.

Refinando consultas de elementos filhos diretos com querySelectorAll

#javascript#dom#seletores

13 reações3 comentários

5 min de leitura

Igor FreitasBoa explicação, Bruno. Aqui na minha equipe, a gente evita esses problemas usando sempre o children e filtra por classe com um loop, assim garante suporte total. Mas claro, fica ma

Wesley FreitasConcordo com o Igor. Em projetos mais antigos, a compatibilidade pesa bastante. Mas, no projeto atual, a gente migrou pra usar o :scope e ficou mais limpo.

Ver todos os 3 comentários →

Sofia Santana

16 de ago.

Como selecionar elementos internos específicos usando múltiplos seletores em JavaScript

#javascript#dom#seletores

9 reações3 comentários

8 min de leitura

Leandro FreitasExcelente explicação, esse método de combinar seletores realmente resolve muita dor, principalmente em estruturas mais complexas. Uma dúvida: em casos de DOM muito grande, você ach

Patricia DantasConcordo com o Leandro, dependendo do tamanho do DOM, o uso de querySelectorAll pode ficar pesado. Uma estratégia que já usei foi limitar o escopo do elemento principal e fazer bus

Ver todos os 3 comentários →