Como modelar a área dos JS de seu site ou sistema

[Detonador PHP 1]

E aew galera, beleza?

Olha só, gostaria de ver com vocês qual a melhor maneira que vocês consideram para organizar os javascripts de seus sites.

Eu atualmente estou usando mais ou menos assim:

Estou criando um arquivo para cada nova função, e apenas dentro da página que vou usar que o chamo.

 

As pastas estão assim:

 

- adds -> pastas com os apis que uso, tipo, calendario, prettyphoto, maskedinput, estas coisas

- funcoes -> aqui vao todas as funcoes, onde cada uma delas fica em um arquivo separado para que eu possa chamá-la apenas quando necessitar

- incs -> são includes de grupos de funcoes, ex: tenho a listagem_completa onde tenho as funcoes(marca_linha, seleciona_linha, marca_todos, exclui_linha) e a listagem_resumida(chamo apenas a função marca_linha)

 

O que vocês acham desta organização.

Tem novas sugestões ou dica para passar?

 

Abraços!

[William Bruno 1501]

se você tiver várias chamadas a arquivos .js, você vai gastar diversas requisições...

 

o ideal, é você ter poucos arquivos. Pois eles serão cacheados. Assim no primeiro acesso, o cliente baixará todo(ou grande parte) do js necessário para a navegação, e dai em diante não precisará mais baixar, usando apenas do cache.

 

 

É uma boa prática deixar as 'chamadas' das funções/plugins apenas nas páginas que serão usadas.

mas se sei lá, você usa lightbox, em várias outras, então já deixa o core do plugin carregado para todo o site.

[Detonador PHP 1]

E ai pessoal, mas sugestões?

Gostaria de saber qual a melhor prática para estruturação e utilização de javascripts no site.

Uma coisa que também tenho dúvidas.

 

Vale qualquer coisa pra fazer um ajax funcionar?

Tipo, eu coloco no nome do botão por exemplo a link para onde o ajax tem que fazer o post. Ex:

 

<input name='cadastro_processa.php' id='bt_novo_cadastro' value='Novo Cadastro' />

E no script coloco assim:

 

$(document).ready(function(){

  $('#bt_novo_cadastro').click(function(){

     var url = $(this).attr('name');
     $.ajax ... e aqui dou o meu post

  });

});

 

Esta é uma boa prática ou desde que funcione isso não tem problema.

 

Estas são minhas dúvidas. Como estruturar e se há maneiras erradas de se trabalhar um script.

Abraço a todos.

[William Bruno 1501]

cara, estude sobre javascript não obstrutivo.

 

como boa prática, o teu site precisa funcionar sem js.

o js deve ser adicionado depois, como uma camada extra. Mas não depender dele.

 

Se um recurso tal, só funciona com js, deixe q ele seja ao menos acessível sem js.

isso é oq dizem as boas práticas.

 

você não precisava do ID, somente para usar no ajax. Poderia fazer a chamada atraves do name:

$("input[name='bt_novo_cadastro']").click(function(){

[Detonador PHP 1]

No caso acho que você não entendeu corretamente minha dúvida.

Eu passei o link do destino do post dentro do atributo name do botão. Eu necessitava passar este atributo para dentro do js para realizar o post.

 

Isto é ruim?

[William Bruno 1501]

não tinha percebido q essa era a questão.

 

péssima prática aquilo q você fez.

 

var url = 'cadastro_processa.php';

pronto. O simples.

 

o script conhece o script. O script conhece o html. Mas o html não precisa conhecer o script.

 

 

 

além do mais, oq você fez vai contra oq eu disse no post acima.

[Detonador PHP 1]

E quanto a disposição dos arquivos, tenho muitos scripts e não sei qual a melhor prática nestes casos.

Hoje separei cada função em um novo arquivo.

 

E vocês, como trabalham com sites que trabalham com muitos js?

[William Bruno 1501]

Hoje separei cada função em um novo arquivo.

qnto mais arquivos mais requisições DNS o browser vai ter q fazer..

 

E vocês, como trabalham com sites que trabalham com muitos js?

um único arquivo .js para todos os scripts.

Oque você chama de "muito" ? de qntas linhas estamos falando ?

[Detonador PHP 1]

Olha... eu dividi em uns 20 arquivos no mínimo.

Cada arquivo deve ter umas 500 linhas por ai.

Isso é muito?

 

Outra coisa... eu sempre comento os códigos JS, mais ou menos assim:

 

comentário do bloco:

///////////////////////////////////////////////////////////////////
//////////   TÍTULO DO BLOCO                             //////////
///////////////////////////////////////////////////////////////////

aqui vai me js referente a este bloco
Se eu precisar de um comentário específico faço assim:

/* comentário de linha */
código

///////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////   FIM DO BLOCO

 

Isso prejudica no peso final do scripr? Deixo assim pra me ajudar a localizar os blocos de códigos com funçõs específicas.