É muito comum ver o Javascript vinculado a determinados seletores para encontrar elementos, armazenar dados e ouvir eventos. Também é comum ver esses mesmos seletores usados para estilizar.
O jQuery (e seu mecanismo de seleção Sizzle) suportam e promovem isso referenciando elementos com sintaxe do tipo CSS. Como tal, essa técnica é particularmente difícil de desaprender (ou refatorar) ao criar projetos.
Eu entendi que isso é resultado do histórico de desenvolvimento de HTML e Javascript e que os navegadores foram criados para consumir / analisar / renderizar eficientemente esse tipo de acoplamento. Porém, à medida que os sites se tornam cada vez mais complexos, essa realidade pode introduzir dificuldades na organização e manutenção dessas camadas separadas.
Minha pergunta é: isso pode e deve ser evitado em sites modernos?
Se eu sou novo no desenvolvimento de front-end e gostaria de aprender as coisas 'da maneira certa', vale a pena aprender a dissociar e evitar essas dependências desde o início? Isso significa evitar o jQuery em favor de uma biblioteca que promova uma estrutura mais dissociada?