Deno - Conheça o mais novo runtime JavaScript

No dia 13 desse mês foi lançada a versão 1.0 do Deno, o novo runtime JavaScript e TypeScript que já está fazendo muito sucesso entre os programadores. Nas últimas semanas, as perguntas: “O que é o Deno?”, “Quais suas características?” e “Ele vai substituir o Node?” tem pipocado na Web e você provavelmente já se fez essas perguntas. Vamos falar sobre elas neste artigo. Iremos começar conhecendo um pouco melhor o criador do Deno.

Um pouco de História

O Deno foi criado por Ryan Dahl, que também criou o Node.js, com certeza o runtime JavaScript mais usado no mundo hoje. Perceba que essas duas tecnologias estão muito conectadas. Inclusive, o nome “Deno” é um ótimo trocadilho para “Node”.

Durante a JSConf 2018, Ryan deu uma palestra com o tema “10 Things I Regret About Node.js” (10 Coisas que Lamento (Arrependo) Pelo Node.js, em tradução livre). Durante esta palestra, ele anunciou o Deno como seu novo projeto. Agora, aproximadamente dois anos depois, a primeira versão do Deno está disponível. Ao analisar a estrutura do Deno, percebemos recursos muito interessantes. Vamos ver alguns deles juntos.

Características do Deno

Engine

O Deno foi desenvolvido com a linguagem Rust e usa o V8, motor de renderização do Google Chrome, em sua estrutura. Consegue imaginar outra tecnologia que usa o V8? Isso mesmo, o Node.js também foi desenvolvido com base nele.

Segurança

Quando começamos a usar o Deno, logo de cara vemos uma pequena questão: nós não conseguimos nos conectar à Rede e nem mesmo acessar alguns recursos do hardware do computador por padrão. O Deno não permite fazermos isso, a menos que deixemos claro qual recurso queremos acessar por meio de flags, conforme iremos ver daqui a pouco.

Pode ser que achemos estranho logo de início precisar dar permissão para acessar recursos de nosso computador, mas isso pode nos trazer alguns benefícios, como diminuir a chance de sofrermos algum ataque em nosso servidor.

Importação de Módulos

Assim como o Node, o Deno possui módulos nativos (Bibliotecas Padrão) e módulos de terceiros. Contudo, há uma diferença na maneira em que eles importam tais módulos para nosso código. O Node usa o tão conhecido npm (Node Package Manager) para baixar pacotes da Web. Por meio do npm nós armazenamos as ferramentas baixadas na pasta node_modules, ou seja, de maneira local. O Deno, por outro lado, realiza o import dos módulos por meio de uma URL, de maneira externa. Se você já usou uma CDN, sabe como isso é muito prático.

Esse recurso pode nos trazer algumas vantagens. Por exemplo: alguns programadores ficam incomodados com o peso que a pasta node_modules traz para o servidor (alguns dizem que ela é mais pesada que um buraco negro ?). Com os imports externos, não será necessário se preocupar com essa questão.

Imports do ES6

Ainda falando de importação de módulos, vemos que o Deno usa os imports do ES6 em sua estrutura. Isso significa que se você já possui algum costume em usar o import / export em seus códigos JavaScript, não vai sentir dificuldades em trabalhar com o Deno.

Suporte a TypeScript

Percebeu que no início do artigo dissemos que o Deno é um runtime JavaScript e TypeScript? O Deno também possui suporte a esse superset do JavaScript. Sabemos que o TypeScript tem crescido bastante nos últimos anos e nos ajuda muito quando precisamos validar os tipos de variáveis no JavaScript, além de outras vantagens.

Se você desejar usar apenas JavaScript com o Deno não tem problema, mas poderá usar arquivos TypeScript também se preferir.

Async/Await e Promises

O Deno nos permite trabalhar com funções assíncronas e promessas de maneira simples. Sabemos que usar um código assíncrono é muito útil e o JavaScript tem um longo histórico com esse conceito. Inclusive, não deixe de conferir nossa série sobre JavaScript Assíncrono aqui em nosso Blog.

Depois de vermos algumas das características do Deno, o que acha de criarmos um pequeno exemplo com ele? Vamos começar com a instalação dele.

Instalação

Para instalar o Deno, iremos usar o Chocolatey. Você pode aprender como instalá-lo neste artigo: Conhecendo Chocolatey: o Gerenciador de Pacotes do Windows

Iremos usar o seguinte comando:

choco install deno

Se você possuir um computador Mac, poderá usar o HomeBrew para realizar a instalação. Se estiver usando Linux, poderá usar o curl.

Para verificar se o Deno foi instalado, execute o seguinte:

deno --version

Será retornado o seguinte:

Agora estamos prontos para nosso primeiro exemplo.

Primeiro Código com Deno - Criando um Servidor Web

Criamos um arquivo chamado first-server.js. Para criar um servidor, vamos precisar do módulo serve do Deno. Para isso, vamos usar a seguinte linha:

import { serve } from 'https://deno.land/std/http/server.ts'

Neste código já vemos os imports do ES6 em prática. Além disso, note que usamos o conceito de destructuring para carregar apenas o módulo serve do inteiro pacote server.ts. Por último, veja que o import veio de uma URL, dos servidores do site do Deno.

Vamos criar a configuração do servidor com a seguinte linha:

const server = serve({ port: 8000 });

Com este código apenas aplicamos o módulo serve para criar um servidor Web e definimos que ele será acessível por meio da porta 8000. Poderíamos definir a porta que desejássemos. Nós atribuímos esse servidor à constante server.

Quando o servidor iniciar, vamos querer ver uma mensagem no console, como um feedback de que está tudo bem. Para isso, basta adicionar um console.log() no código:

console.log('Server running...');

Agora, precisamos dizer o que o servidor irá nos retornar. Para isso, o Deno usa um laço de repetição for, mais especificamente um for of. Ele ficará da seguinte forma:

for await (const req of server) {
	req.respond({
		body: '<h1>Hello Hcode</h1>'
	});
}

Perceba que usamos o await neste for(). Logo, já estamos trabalhando com código assíncrono. Este código define que enquanto houver requisições em nosso servidor, será retornado uma mensagem de boas vindas.

Nosso código está pronto. Para testá-lo, vamos executar o seguinte comando:

deno run first-server.js

Essa estrutura é bem parecida com o npm, que possui o comando npm run. Quando executamos esse comando, é retornado o seguinte para nós:

Ocorreu um erro. Ele informa que o Deno não possui permissão para acessar a Rede. Lembra que falamos há pouco sobre a questão da segurança no Deno, que ele não acessa a Internet por padrão? É necessário dar permissão para que ele faça isso. Neste momento vemos a importâncias das flags no Deno. Vamos executar o comando novamente, mas agora ele estará assim:

deno run --allow-net first-server.js

Com a flag “--allow-net” nós demos a permissão necessária para o Deno acessar nossa Rede. Note que informamos a flag antes do nome do arquivo. É importante lembrar essa ordem para que o comando funcione bem. Além disso, perceba que deixamos claro não apenas o nome do arquivo JS, mas também sua extensão. O Deno exige que o nome do arquivo esteja “completo”. Ao executar o comando novamente, vemos o seguinte:

Agora sim o servidor está funcionando sem problemas. Para acessar o servidor, precisamos digitar localhost:8000 em nosso navegador. Se você definiu outra porta, deve informá-la depois dos dois-pontos. Ao acessar o servidor, vemos o seguinte resultado:

Nosso código está funcionando!!! O que achou da estrutura de nosso primeiro arquivo usando o Deno? É sempre muito bom criar nosso primeiro “Hello World” usando qualquer tecnologia. Mas que tal criarmos um segundo exemplo, vendo um pouco mais a fundo os recursos do Deno? Vamos fazer isso agora.

Segundo Código com Deno - Criando um Gerador de QR Code

Nosso segundo exemplo se chamará qrcode-generator.js. Ele também criará um servidor Web, mas iremos enviar como retorno uma imagem de um código QR. Para isso, vamos realizar o import de um módulo de terceiro voltado para geração destes códigos. As primeiras linhas do arquivo ficarão assim:

import { qrcode } from 'https://deno.land/x/qrcode/mod.ts'
import { serve } from 'https://deno.land/std/http/server.ts'

Depois, iremos criar o servidor:

const myServer = serve({ port: 8000 });

A próxima configuração será criar o conteúdo do código QR. Para isso, vamos usar este código:

let base64 = await qrcode('https://hcode.com.br', {
	size: 300
})

O método qrcode() é a chamada do módulo que importamos no início do código. O primeiro parâmetro que ele espera é a string que será embutida no QR Code. O segundo parâmetro é um objeto de configurações, como o tamanho que o código possuirá. Ele retorna uma promise, por isso usamos o await nesta linha também.

Por fim, iremos adicionar o console.log() como mensagem de que o servidor iniciou sem problemas e também o for of para esperar as informações da requisição. Iremos usar este código:

console.log('Server running...');
for await (const request of myServer) {
	request.respond({
		headers: new Headers({
			'Content-Type': 'text/html'
		}),
		body: `
			<div style="display: flex; justify-content: center; margin-top: 30px;">
				<img src="${base64}" />
			</div>
		`
	});

}

Com este código definimos que o servidor irá retornar uma imagem, que estará no centro da página e vai possuir como conteúdo o valor do QR Code gerado. Podemos ver alguns pontos interessantes neste código. Por exemplo: vimos que podemos definir qual será o tipo de conteúdo da página por meio da opção headers. Além disso, estamos retornando o body usando o recurso de template string.

Vamos iniciar esse servidor com o seguinte comando:

deno run --allow-net qrcode-generator.js

Agora, ao acessar localhost:8000, vemos o seguinte:

Nosso QR Code foi gerado corretamente. Se desejar, poderá testar escaneando esse código com seu celular ?. Incrível, não é mesmo? Mas acho que podemos melhorar só mais um pouco este exemplo. O conteúdo do QR Code está estático. E se pudéssemos informar a URL a ser adicionada ao código de maneira dinâmica? Vamos implementar essa inteligência ao código agora.

Podemos informar esse parâmetro para o Deno por meio do Terminal. Se você já trabalhou com Node, provavelmente conhece a variável process.argv. Podemos fazer o mesmo com o Deno, com o seguinte código:

let args = Deno.args;

Bem simples, não concorda? Nesse conceito também vemos uma pequena diferença entre o Node e o Deno. O process.argv identifica o comando node e qualquer outro comando necessário como um argumento. Assim, geralmente acessamos a posição 2 ou 3 desse array que é retornado. Já o Deno consegue entender que o comando deno e run não são argumentos. Logo, o primeiro argumento que informarmos será a posição 0 do array, o que simplifica o nosso código. Vamos informar a variável args para o método qrcode(), desta forma:

let base64 = await qrcode(args[0], {
	size: 300
})

Agora podemos informar a URL que desejamos criar. Por exemplo, podemos executar o seguinte comando:

deno run --allow-net qrcode-generator.js https://youtube.com/hcodebrasil

E agora ao acessar o localhost:8000, veremos o seguinte resultado:

Se você escanear esse código, será direcionado para o YouTube da Hcode.

Você pode encontrar os códigos desenvolvidos neste artigo em nosso GitHub.

Vemos assim que podemos fazer muitas coisas interessantes com o Deno! Após ver esses exemplos, resta uma pergunta para responder.

Afinal de contas, o Deno vai matar o Node?

É comum ouvir essa pergunta quando uma nova ferramenta é lançada. Mesmo que o Deno já se mostre um excelente ambiente de desenvolvimento, sabemos que o Node já está há muito mais tempo no Mercado. Afinal, o Node foi criado em 2009, há exatos 11 anos. É uma tecnologia muito madura e amplamente usada. O próprio Ryan Dahl comentou sobre essa diferença de tempo de desenvolvimento das duas ferramentas no artigo de lançamento do Deno. Além disso, o Node faz parte da OpenJS Foundation. 

Podemos dizer que a grande pergunta não é se o Deno vai matar o Node, mas sim como esse novo runtime vai ajudar o Desenvolvimento Web. Vemos que o Deno nos trouxe várias funcionalidades interessantes, que ajudam na performance de nossa aplicação. Por ser um novo “concorrente”, a tendência é que o Node também se adapte e traga novas features interessantes. A verdade é que quem sai ganhando nessa questão somos nós, que trabalhamos com essas tecnologias.

Ainda iremos ouvir falar bastante sobre o Node e sobre o Deno. O que resta a nós é continuar estudando esses dois runtimes incríveis e continuar usando seus recursos para criar projetos modernos para a Web.

Até o próximo artigo :)