Termo pesquisado: Javascript
Posts encontrados: 5
HTML 5 Funcionando no Internet Explorer
Postado em 03 de Junho de 2010, às 20:07Olá pessoal!
Todo bom desenvolvedor web já conhece pelo menos uma grande novidade que o HTML5 traz para nós. Da mesma forma, todos sabem que o Internet Explorer não reconhece as novas tags do HTML5.
Mas, já existe uma solução em javascript para este problema. Basta acrescentar este código na tag <head> da sua página. O código abaixo deve, obrigatoriamente, vir antes de qualquer script CSS do seu site:
Se preferir, acesse o site do projeto http://code.google.com/p/html5shiv/.
Quero aproveitar o ensejo deste artigo (gastei meu português agora!) para mostrar uma curiosidade sobre o IE, na verdade, é graças a esta peculiaridade que foi possível desenvolver o HTML 5 shiv.
Veja o código abaixo:
Se tentarmos abri-lo no IE, o navegador da Microsoft não vai aplicar os efeitos (CSS) na tag <time>, veja o screenshot abaixo:
Agora veja o código abaixo, ele soluciona o problema do IE não reconhecer a tag <time> utilizando javascript para adicionar a tag ao DOM. Ao fazê-lo, o IE se vê obrigado a renderizar uma tag que não reconhecia com os efeitos definidos no seu código CSS.
Desta forma podemos trabalhar com HTML5 naturalmente no IE. Veja o resultado no screenshot abaixo:
Até mais pessoal, espero ter ajudado alguém com essa dica.
Plugin do JQuery Para Mascarar Campos do Formulário
Postado em 14 de Março de 2010, às 14:27Olá pessoal! Esta semana, enquanto programava, precisei de um plugin para o JQuery que me permitisse colocar mascaras nos campos de um formulário.
Aí é que começaram os meus problemas, não sabia qual era o melhor plugin para utilizar nem qual seria o mais ideal para o tipo de aplicação que eu estava fazendo, afinal de contas, existem vários plugins para criar mascaras em campos do formulário HTML.
Depois de muito tempo pesquisando (em torno de uma hora de pesquisa) resolvi fazer um apanhado dos melhores plugins que encontrei para mascarar campos, veja abaixo:
- MeioMask, v 1.1.3 (Nacional) - Veja Demo (Em inglês) - Página no JQuery;
- Masked Input, v 1.2.2 (Internacional) - Veja Demo (Em inglês) - Página no JQuery;
- Price Format, v 1.3 (Nacional) - Veja Demo (Em inglês) - Página no JQuery;
- Mask Input Money, v 0.2 (Nacional) - Veja Demo (Em português) - Página no JQuery;
Eu escolhi estes somente pelo fato de todos eles possuírem um site próprio fora do JQuery, onde cada um disponibiliza um Demo de seus plugins em funcionamento. Em minha opinião, um demo é crucial para que alguém possa escolher qual o melhor plugin para utilizar, por isso desconsiderei outros plugins que não possuíam um site próprio, nem um demo para testar.
Fiz questão de colocar entre parênteses na frente de cada plugin a origem do mesmo, notem como entre os quatro plugins que escolhi, três deles são de brasileiros... (É isso ai Brasil!!! Somos ou não os melhores?!).
Não dá para dizer qual o melhor e nem qual o pior, pois eu considero que cada um pode ser muito útil dependendo do tipo de trabalho que você está fazendo. Tem alguns plugins que são mais simples e mais compactos e outros são mais completos, porém, são mais pesados, mas, minha opinião é de que todos são bons.
Beleza gente, quando eu precisar de um plugin para minha aplicação web, vou usar esta pequena lista para definir qual o melhor de acordo com minha aplicação. Espero que essa lista seja útil para vocês também.
Vou tentar fazer um laboratório com esses plugins, assim que eu tiver tempo disponível. Se eu o fizer, prometo postar os resultados dos testes aqui. Até mais pessoal.
Ajax loader
Postado em 15 de Agosto de 2009, às 20:16Olá pessoal, demorei, mas voltei!!
Hoje quero falar sobre um site legal que encontrei, tenho certeza de que ele será muito útil para muitos desenvolvedores web por ai afora.
Neste site que encontrei, cujo nome é "ajaxload.info", é possível personalizar e baixar vários tipos de Ajax loaders para serem utilizados em sites que utilizam o Ajax. O link para o site é www.ajaxload.info.
O serviço ainda é beta, gratuito e é fácil de usar, talvez o único problemas seja o fato de que o site está em inglês, mas para quem trabalha com informática, principalmente desenvolvimento, isso é normal.
Vou explicar as três únicas etapas para gerar seu próprio Ajax loader:
- No campo "Indicator type", localizado no quadro amarelo, selecione o tipo de Ajax loader que você deseja. Existem vários tipos, tenho certeza que você vai perder um tempinho escolhendo qual o melhor para usar no seu site;
- Em "Background color" defina uma cor para o fundo da imagem do Ajax loader. Sei que é tolice, mas, devo lembrar que um Ajax loader não passa de uma imagem do tipo gif que é animado, por isso esta imagem pode ter uma cor de fundo, ou se preferir você pode deixar transparente marcando a caixa de seleção "Transparent background" logo abaixo;
- Finalmente, defina uma cor para a animação do Ajax loader no campo "Foreground color", essa é a cor do desenho;
Feito os três passos, basta clicar sobre o botão "Generate it !". Um quadro vermelho abaixo desse quadro amarelo de que falei antes, vai mostrar um preview do Ajax loader, se não gostar basta reeditar as definições no quadro amarelo. Caso você tenha gostado do resultado, clique sobre o botão "Download it" e salve a imagem em seu servidor web para utilizá-la no seu site.
Veja abaixo alguns testes com apenas alguns tipos de Ajax loaders que o site disponibiliza:
.gif){kind=small}
.gif){kind=small}
.gif){kind=small}
.gif){kind=small}
É isso ai pessoal, qualquer dúvida, crítica ou sugestão, basta comentar este post, até logo.
Compatibilidade dos Browsers com os Padrões Web Definidos Pela W3C
Postado em 11 de Julho de 2009, às 20:40Olá pessoal!
No meu último post (Qual Framework Javascript devo usar?), fiz um teste com cinco frameworks javascript em sete browsers diferentes. Por meio desta pesquisa chegamos a um fato curioso, o terrível desempenho de todos os frameworks nos navegadores da Microsoft (IE7 e IE8).
Sendo assim, neste post vou mostrar os resultados de um teste que realizei em uma ferramenta web de testes de compatibilidade. Mas, antes quero explicar um pouco sobre o Acid3, que é a ferramenta utilizada no teste, é importante conhecer a ferramenta ou não será possível entender os resultados que mostrarei neste post.
O Acid3 é uma suíte de teste de compatibilidade com padrões web (Web Standards) W3C com navegadores com 100 diferentes tipos de testes.
Esse teste tem um nível muito alto de exigências para os navegadores (browsers) em comparação com o seu antecessor - Acid2. A sua escala vai de 1 a 100.
Em 26 de Março de 2008, o Opera foi o primeiro navegador a atingir a marca dos 100/100 no teste acid3. Porém no mesmo dia foi anunciado que o Webkit do Safari em desenvolvimento conseguiu também com sucesso atingir a escala 100.
O que é testado nesta suíte? Veja abaixo:
- DOM2 Core
- DOM2 Events
- DOM2 HTML
- DOM2 Range
- DOM2 Style (getComputedStyle, …)
- DOM2 Traversal (NodeIterator, TreeWalker)
- DOM2 Views (defaultView)
- ECMAScript
- HTML4 (<object>, <iframe>, …)
- HTTP (Content-Type, 404, …)
- Media Queries
- Selectors (:lang, :nth-child(), combinators, dynamic changes, …)
- XHTML 1.0
- CSS2 (@font-face)
- CSS2.1 (’inline-block’, ‘pre-wrap’, parsing…)
- CSS3 Color (rgba(), hsla(), …)
- CSS3 UI (’cursor’)
- data: URIs
- SVG (SVG Animation, SVG Fonts, …
Agora que você já sabe um pouco sobre o Acid3, veja abaixo um gráfico com os resultados dos testes que realizei:
O teste foi realizado duas vezes em cada browser (apenas para garantir, pois este não é um teste de performance), notem que utilizei os mesmo navegadores utilizados para testar os frameworks javascript no post supracitado.
Como podemos ver, CLARAMENTE, o IE7 e IE8 não conseguem realizar nem metade das 100 tarefas de compatibilidade sugeridas pelo Acid3. O Opera 9.64 ficou um pouco abaixo da média dos outros browsers, mas isso não será um problema por muito tempo, pois provavelmente ele será descontinuado assim que for lançado o Opera 10 final. Somente o Firefox vai ficar devendo no que diz respeito a compatibilidade.
"E os internautas e até alguns desenvolvedores inescrupulosos ainda preferem o Internet Explorer!"
Obs.: Algumas partes deste post foram formuladas com base no site de pesquisas wikipedia.org.
Qual Framework Javascript devo usar?
Postado em 09 de Julho de 2009, às 14:13Olá pessoal! Esta semana estive pensando, qual seria o melhor framework javascript para se utilizar? Resolvi fazer uma pesquisa na internet e descobri uma ferramenta que realiza testes com diversos frameworks, o site da ferramenta é o slickspeed.
Nesta ferramenta nós podemos testar cinco frameworks, entre eles: MooTools, JQuery, Prototype, YUI Selector e o Dojo. Vocês já devem ter percebido que a ferramenta é disponibilizada pela própria MooTools.
Infelizmente as versões de alguns frameworks não estão atualizadas, mas já dá para ter uma idéia da performance de cada uma. O MooTools, obviamente, já está na sua versão mais recente, que é a 1.2.3. O site para testes utiliza a versão 1.2.6 do JQuery, mas, este framework está na versão 1.3.2. O Prototype se apresenta com umas das versões mais atuais, a 1.6.0.2, sua versão mais recente (de acordo com o seu site) é a 1.6.0.3, mas, já existe um RC1 da versão 1.6.1. O YUI está atualmente na versão 2.6.0 (versão estável), já existe a versão de testes do YUI Selector que é a 3.0.0 Beta 1, porém, na ferramenta de testes é utilizado a 2.5.2. Finalmente o Dojo 1.3.1 (que é sua versão atual) não foi utilizado, mas sim, uma versão um pouco mais antiga, a Dojo 1.1.1.
Esta ferramenta de testes verifica a performance de cada framework no browser que você utiliza. O melhor framework seria aquele que executasse as quarenta tarefas propostas pela ferramenta em menos tempo. Portanto, realizei um teste com todos os frameworks em sete browsers diferentes. Para cada browser eu realizei três testes, o resultado é exatamente a média do tempo gasto por cada framework nos três testes realizados.
É importante ressaltar que no momento dos testes eu não estava executando nenhum outro programa no meu computador, ou seja, tinha apenas o browser que seria testado e ainda neste browser havia apenas a página da ferramenta slickspeed. Os resultados podem variar de acordo com o computador, a quantidade de memória e a velocidade do processador interferem, de maneira geral, nos resultados de todos os frameworks. Os teste foram realizados em notebook Dell Core 2 Duo 2.0 GHz com 3GB RAM.
O gráfico abaixo exibe o resultado desse teste:
Os números no gráfico consistem no tempo que cada framework precisou para realizar um conjunto de 40 tarefas, esse tempo está em milissegundos. Portanto, a escala do gráfico vai de 0 a 2000 milissegundos, em cada barra existe o número exato de tempo que cada framework gastou para executar as tarefas.
O gráfico nos apresenta claramente que: Dojo e JQuery são os frameworks mais rápidos em todos os sete browsers testados. Por outro lado, YUI Selector e Prototype são os mais lentos em todos os browsers em que foram testados.
A ferramenta de testes slickspeed, também verifica se os frameworks não geram erros durante sua execução. Sendo assim, vamos aos erros! Os frameworks MooTools, JQuery e Prototype não produziram nenhum erro grave em nenhum browser. Por outro lado, YUI Selector produziu 4 (quatro) erros no IE8, nos outros browsers ele funcionou perfeitamente. Quanto ao Dojo, ele produziu 3 (três) erros em cada um dos seguintes browsers: Firefox 3.5, Opera 10 Beta e Safari 4.0. Nos browsers IE7, Opera 9.64 e Chrome 2.0 o Dojo funcionou bem, mas, o mais grave de tudo é que este framework não funcionou no IE8, nenhuma das 40 (quarenta) tarefas sugeridas pelo slickspeed foi executada neste browser, portanto o Dojo produziu quarenta erros no IE8.
Quero aproveitar e fazer um parênteses aqui, sei que não é o propósito deste artigo, mas, vocês notaram a excruciante diferença de performance de todos os cinco frameworks entre os browsers baseados no Netscape (Firefox 3.5, Opera 10 Beta, Opera 9.64, Chrome 2.0, Safari 4.0) e os browsers da Microsoft? E as pessoas ainda insistem em utilizar essas porcarias da Microsoft!!!!
Claro que performance não é a única coisa que se leva em consideração na hora de escolher um framework para desenvolver um site. O tamanho do framework é e sempre deve ser levado em consideração, por este motivo, eu fiz uma pequena pesquisa e o resultado dela eu coloquei neste gráfico abaixo, que compara a diferença de tamanhos dos frameworks. Quero lembrar que levei em consideração os tamanhos dos frameworks sem nenhum tipo de compactação. Veja o gráfico abaixo:
Neste gráfico fica claro que o YUI Selector é o framework mais pesado, mas, devo lembrar que junto com o YUI Selector vem muitas imagens e códigos css além dos arquivos .js.
Para concluir este artigo, quero dizer que a performance e o tamanho dos frameworks não são as únicas coisas que devem ser levadas em consideração. Precisamos avaliar por nossa conta os benefícios que cada framework nos traz, ou seja, cada um nos oferece uma gama de ferramentas muito grande, mesmo assim, cada um deles possui alguma ferramenta incomum. Então, na hora de escolher um framework javascript devemos ficar com aquele, ou aqueles, que nos oferece exatamente o que precisamos para desenvolver um site e que ainda seja leve e rápido.
É isso ai pessoal, se alguém tiver alguma crítica ou sugestão, por favor, me envie para que eu possa corrigir ou melhorar este artigo. Obrigado!
Receba Atualizações
Posts Recentes
- Code Completion no Netbeans com PHP
- CSS3 Funcionando no Internet Explorer
- HTML 5 Funcionando no Internet Explorer
- Inocência ou Não?
- Ranking dos Maiores Browsers do Mundo e do Brasil.
- Como Programadores Caçam Elefantes
Categorias
- Banco de dados (0)
- Diversos (5)
- Fotos e Imagens (0)
- Humor (5)
- Internet (12)
- Java (0)
- Javascript (3)
- Linux (1)
- Livros (3)
- PHP (2)
- Programação (10)
- Tecnologia (3)
- Vídeos (1)
- Windows (2)