Tag: Google

Publicado em

A API do Google V8 une o WebAssembly e a Web assíncrona

Os desenvolvedores do mecanismo V8 JavaScript/WebAssembly do Google introduziram a API JavaScript Promise Integration (JSPI), permitindo que aplicativos WebAssembly que assumem que o acesso à funcionalidade externa seja síncrono funcionem sem problemas em ambientes assíncronos. Isso foi feito pois hoje, API WebAssembly JavaScript Promise Integration suspende um aplicativo Wasm quando ele emite uma chamada de API síncrona e a retoma quando a operação de E/S assíncrona é concluída.

Importante!!!!!

Atualmente em estágio experimental, o JSPI ainda não deve ser usado em aplicativos de produção, disseram os desenvolvedores. Eventualmente, ele se tornará um padrão para implementação nos principais navegadores, disseram eles.

Quando aconteceu?

Apresentado em uma postagem de blog V8 em 19 de janeiro, o JSPI faz a ponte entre aplicativos WebAssembly síncronos e APIs da Web assíncronos. Isso é feito suspendendo o aplicativo quando ele emite uma chamada de API síncrona e retomando quando a operação de E/S assíncrona é concluída. E o JSPI faz isso com pouquíssimas alterações no próprio aplicativo.

Muitas APIs modernas na Web funcionam de forma assíncrona, dividindo a funcionalidade no início e na resolução de uma operação. JSPI intercepta o JavaScript Promise retornado de uma chamada de API assíncrona, suspendendo a lógica principal do aplicativo WebAssembly e retornando um Promise da exportação usada para entrar no aplicativo WebAssembly. Quando a API assíncrona é concluída, o aplicativo WebAssembly é retomado para que possa processar os resultados da chamada de API.

Trabalhar com Promises é difícil, particularmente com WebAssembly, porque a manipulação direta de Promises no WebAssembly não é possível, disseram os desenvolvedores. O JSPI permite que os desenvolvedores criem aplicativos WebAssembly usando APIs síncronas e ainda participem do ecossistema assíncrono da web.

O JSPI está sendo desenvolvido nas arquiteturas Intel e ARM64. Está disponível para Linux, Windows, macOS e ChromeOS. Os desenvolvedores podem testar o JSPI localmente acessando chrome://flags no Chrome, procurando por “Experimental WebAssembly JavaScript Promise Integration (JSPI)” e marcando a caixa. Recomenda-se o uso do canal Chrome Canary. JSPI ainda não pode ser habilitado para usuários finais.

O WebAssembly foi aclamado como um avanço no desempenho de aplicativos da web. O formato de instrução binária permite que muitas linguagens de programação diferentes, incluindo C/C++, C# e Rust, sejam usadas para programação na web.

Publicado em

Uma nova fase para o Angular

Com as constantes evoluções do framework, equipe e forte conexão com a comunidade angular, o projeto pretende compartilhar mais sobre o trabalho e futuros projetos considerados. Será adicionada uma página no angular.io com o roadmap, que será mantida em andamento pelo menos trimestralmente.

E o que é o roadmap?

O Angular recebe uma grande variedade de solicitações de recursos, tanto de dentro do Google quanto da comunidade. A lista de projetos contém tarefas de manutenção, refatoração de código, melhorias de desempenho e outras melhorias. Eles reúnem representantes de relações com desenvolvedores, gerenciamento de produtos e engenharia para priorizar a lista. Conforme novos projetos entram na fila, ocorre um posicionamento com base na prioridade relativa de outros projetos. Você pode verificar neste link quais são os projetos que serão lançados em atualizações futuras.

O Roadmap:

Você pode encontrar os projetos do backlog que já estão em andamento e também os que trabalharemos em breve.Os trabalhos serão executados conforme a lista de prioridades. Para maior transparência, foram inclusos trabalhos que afetam o próprio desenvolvimento do angular e projetos que se aplicam apenas ao desenvolvimento interno do Google.

O documento foi dividido em duas seções que representam todos os projetos em andamento em uma seção e, na outra, os projetos futuros. Você pode esperar que o trabalho chegue em versões futuras, dependendo de quando forem concluídos e de seu impacto na API pública do Angular. Como o projeto segue um controle de versão semântico, os novos recursos chegarão em versões menores ou maiores e com alterações que podem ser incompatíveis com versões anteriores na versão principal.

O que é controle de versão semântico?

Com a curva de crescimento de um software, novas dependências, novos pacotes irão ser integrados ao software. Se as especificações das dependências forem rígidas, pode ocorrer o bloqueio de versão. Se forem especificadas vagamente, você terá uma promiscuidade da versão. Como solução, cria-se um conjunto de regras e requisitos que ditam como os números de versões são atribuídos e incrementados. Para mais informações, acesse: https://semver.org/

Gostou desta notícia? Comente abaixo!

Referências:

Publicado em

Google: guia de como gerar dados estruturados usando JS

Recentemente, o Google publicou uma diretriz de desenvolvedor na página de desenvolvedores do Google. Este documento fornece uma visão sobre como criar dados estruturados utilizando JavaScript e implementá-los no site, ou fazê-los corretamente para que possa trazer benefícios na pesquisa do Google. Este novo guia, descreve métodos para adicionar dados estruturados dinamicamente a um site usando JavaScript. Atualmente, o uso de JavaScript é essencial para criar um site com funcionalidade aprimorada. As novas dicas do guia de desenvolvimento da Google serão especialmente valiosas para especialistas de SEO e desenvolvedores Web.

Atualmente, existem muitas maneiras de gerar dados estruturados com JavaScript, mas as mais utilizadas são:

O gerenciador de tags do google é utilizado para gerar JSON-LD dinamicamente. Ele é uma plataforma que permite o gerenciamento de tags no seu site sem editar o código. Para gerar dados estruturados com o Gerenciador de Tas do Google, você precisa:

  • Configure e instale o Gerenciador de tags do Google ao seu site;
  • Adicionar uma tag HTML personalizada ao contêiner;
  • Cole o bloco de dados estruturado desejado no conteúdo da tag;
  • Instale o contêiner conforme mostrado na seção Instalar o Gerenciador de tags do Google no menu de administração do contêiner;
  • Para adicionar a tag ao seu site, publique seu contêiner na interface do Gerenciador de tags do Google e, por fim:
  • Teste a sua implementação.

E a outra maneira de gerar dados estruturados é usando JavaScript para gerar todos os dados estruturados ou adicionar mais informações de dados renderizados no servidor. De qualquer forma, o Google Search pode entender e processar dados estruturados disponíveis no DOM ao renderizar a página. Para saber como o Google Search processa o JavaScript, consulte o guia básico de JavaScript aqui.

Para isso, você precisa:

  • Encontrar o tipo de dado estruturado em que você está interessado;
  • Editar o HTML do seu site para incluir um snippet JavaScript.
  • Testar sua implementação com o Rich Results Tests.

Gostou deste artigo? Comente abaixo!

Referências:

https://codeburst.io/javascript-news-and-updates-april-2020-98ab1ba67418

https://developers.google.com/search/docs/guides/javascript-seo-basics

Publicado em

Novas funcionalidades DevTools

O Google Chrome fornece um conjunto robusto de ferramentas integradas diretamente no navegador, chamado afetivamente de DevTools do Chrome. Essas ferramentas são atualizadas o tempo todo pela equipe de desenvolvedores do Google Chrome; portanto, às vezes vale a pena procurar no site do DevTools para ver as novidades.

Alguns dos recursos menos conhecidos se enquadram na API do utilitário do console. Isso significa que eles estão disponíveis apenas para uso no console do Chrome. Você não pode usar esses recursos dos seus scripts.

  1. $ e $$

Esses dois caras são pseudônimos. Um único $ é um atalho para document.querySelector () e um duplo $$ é um atalho para document.querySelectorAll ().

Digamos que tenhamos um documento HTML simples parecido com este:

<div class="container">
    <div id="app">
        <div :class="{ ugly: isUgly }">{{ message }}</div>
        <h2 id="theCount">The count is: {{ count }}</h2>
        <button class="btn btn-primary" @click="increment">+</button>
        <button class="btn btn-primary" @click="decrement">-</button>
        <button class="btn btn-primary" @click="applyUgly">make ugly</button>
    </div>
</div>

E vamos especular ainda mais que queremos selecionar o primeiro botão deste documento, bem como uma coleção de todos os botões. Dê uma olhada neste:

O único $ retorna um elemento enquanto o $$ retorna a coleção.

Observe que, se você estiver usando uma biblioteca como o jQuery, que atribuirá outro valor a $, substituirá a funcionalidade interna.

  1. A função inspect()

Este pode ser usado em conjunto com o código anterior. Digamos que nosso documento HTML seja enorme e gostaríamos de selecionar um botão no HTML no console. Se inserirmos o seguinte:

Assim que pressionar enter, o DevTools passará da guia Console para a guia Elementos e destacará o elemento HTML que foi selecionado.

Também podemos usar o atalho $$ com inspect(). Ele exibirá uma lista de correspondências no console e podemos clicar em uma para ir para ela no DOM.

 

  1. key / values

Este é útil para ver rapidamente do que um objeto é composto. Digamos que temos o seguinte objeto simples.

let myObj = {
    first: 'alex',
    last: 'ritzcovan',
    state: 'ny'
}

 

Usando keys() e values(), podemos extrair exatamente isso ou podemos exibir as chaves e os valores chamando o objeto diretamente, como mostrado abaixo:

 

  1. Table

Por último, temos a função table(). Usando o mesmo objeto que usamos anteriormente, se o passarmos para table(), obtemos o seguinte no console.

Referência: https://medium.com/dailyjs/5-chrome-devtools-utilities-you-need-to-know-5bfe58c75773

Gostou? Comente abaixo!

Publicado em

O Google adiciona noções SEO JavaScript ao seu guia do desenvolvedor

Recentemente, o Google adicionou uma seção básica de SEO do JavaScript ao guia do desenvolvedor da Rede de Pesquisa. A nova seção tem como objetivo fornecer aos iniciantes uma visão geral de como o Googlebot processa o JavaScript. Isto inclui descrições gerais de como o Google processa JavaScript, além de algumas práticas recomendadas.

Além de uma visão geral de como o Googlebot rastreia, processa e indexa aplicativos da Web JavaScript, o guia também fornece dicas básicas, acompanhadas de links para recursos mais detalhados das funcionalidade de indexação Google, como as seguintes:

  • Como descrever sua página com títulos e snippets exclusivos: O JavaScript permite que os SEOs definam ou alterem títulos e meta descrições.
  • Como escrever código compatível: Os desenvolvedores devem estar cientes das limitações da API e do JavaScript do Googlebot.
  • Códigos de status HTTP importantes: Os códigos de status informam ao Googlebot que uma página foi movida ou que ela não deve ser rastreada ou indexada.
  • Informações sobre a tag meta-robôs: O Google afirma que o uso do JavaScript para remover ou alterar a metatag do robô pode não funcionar da maneira esperada, explicando: “O Googlebot ignora a renderização e a execução do JavaScript se a tag de meta-robôs contiver inicialmente ‘noindex’. Se você quiser usar JavaScript para alterar o conteúdo da metatag do robô, não defina o valor da metatag como “noindex”.
  • Corrigindo imagens e conteúdo carregado com lazy load: O Google recomenda o uso de lazy load para aumentar o desempenho e diminuir os custos de largura de banda.

Por que devemos nos importar. O JavaScript é uma ferramenta poderosa para desenvolvedores e pode melhorar a experiência do usuário. Entender como o Googlebot processa seus aplicativos da web com JavaScript pode ajudar você a torná-los mais detectáveis, o que pode aumentar sua visibilidade orgânica e atrair mais tráfego para seu site.

 

 

 

 

Publicado em

J2CL: Um transpilador Java para JavaScript

Criado, desenvolvido pela Google, este compilador open source realiza source-to-source converte Java para JavaScript. Os desenvolvedores do J2CL dizem que o compilador permite um uso fluido do Java nas suas aplicações JavaScript.

O J2CL tenta resolver um problema diferente que frameworks similares como o GWT e não foi jeito para substituir estes framworks. Ao invés disto, o J2CL se preocupa interoperabilidade e a reutilização de código entre as plataformas. Você pode usar o J2CL para fazer um pedaço de código acessível no JavaScript ou converter uma aplicação inteira com ele.

A ferramenta foi desenvolvida com flexibilidade em mente e pode ser aplicada de diversas formas diferentes. Uma forma que você pode utiliza-la seria para implementar um algoritmo complexo em múltiplas tecnologias que atuam em plataformas diferentes.

Segundo Thomas Deegan (ex-contribuidor do projeto), um exemplo deste tipo de implementação ocorreu com a migração do Google Docs que precisava ser reescrito para se tornar uma aplicação web. Neste caso, o j2CL transpilou todas a lógica de renderização e manipulação dos documentos para JavaScript.

Mas a sua utilidade não para ai, você poderia aproveita-lo para converter para o back-end JavaScript (Node.js) criando bibliotecas que originalmente foram desenvolvidas em Java.

Infelizmente, nem todas as APIs Java, como a Java Reflection, tem suporte. Por default, o Código transpilado não é publico e diversos anotações Java (Java Annotations) fo JsInterop podem ser utilizadas para identificar quais classes, métodos, intancias de variáveis, etc… podem ser expostos.

O projeto possui um exemplo simples de “Hello World” para demonstrar sua utilização. Veja abaixo um exemplo similar utilizando uma anotação Java como ela pode ser utilizada no JavaScript.

package com.acme

import jsinterop.annotations.JsType;

@JsType
public class HelloWorld {
    public static String getHelloWorld() {
        return "Hello from Java!";
    }
}

Pode ser utilizado da seguinte forma:

const HelloWorld = goog.require('com.acme');
console.log(HelloWorld.getHelloWorld());

De acordo com os desenvolvedores, o J2CL está em faze de produção e tem servido como a tecnologia utilizada para em diversos apps importantes do GSuites como Gmail, Inbox, Docs, Slides e Calendário.

Para mais informações, visite o guia básico do projeto no Github.

 

Publicado em

Experiências do Google com armazenamento de valor-chave

O Google anunciou recentemente (link em Inglês) sua intenção de enviar duas novas propostas do WICG em uma versão futura do Chrome. KV Storage (armazenamento de valor-chave) tenta trazer a conveniência do LocalStorage, mas com melhor desempenho. A intenção é entregar isso como o primeiro exemplo de um módulo integrado, aproveitando a proposta de mapas de importação.

O ecossistema JavaScript teve uma abordagem um pouco fraturada para armazenar e armazenar dados em cache localmente. Conforme explicado por Philip Walton, engenheiro de software do Google que trabalha na plataforma Web,

Os fornecedores de navegadores e especialistas em desempenho da Web têm dito, durante boa parte da última década, que o localStorage é lento e os desenvolvedores da Web devem parar de usá-lo. Para ser justo, as pessoas dizendo isso não estão erradas. localStorage é uma API síncrona que bloqueia o thread principal e, sempre que você acessá-lo, você pode impedir que sua página seja interativa. O problema é que a API localStorage é tão tentadoramente simples, e a única alternativa assíncrona ao localStorage é o IndexedDB, que (vamos encarar isso) não é conhecido por sua facilidade de uso ou API de boas-vindas.

A Web Incubator CG (WICG) recentemente promoveu o KV Storage para fazer parte da especificação do W3C IndexedDB. KV Storage semelhante ao localStorage no utilitário, mas mais moderno e fica em camadas em cima do IndexedDB. A especificação exige que ele seja implementado pelos fornecedores de navegadores como um módulo interno e use o IndexedDB como seu backing store.

Exemplo de uso da API de armazenamento KV conforme fornecido pela especificação:

import { storage } from "std:kv-storage"; // specifier prefix not final

(async () => {
  await storage.set("mycat", "Tom");
  console.assert(await storage.get("mycat") === "Tom");

  for await (const [key, value] of storage.entries()) {
    console.log(key, value);
  }
  // Logs "mycat", "Tom"

  await storage.delete("mycat");
  console.assert(await storage.get("mycat") === undefined);
})();

Existe um polyfill de Armazenamento KV para navegadores que suportam IndexedDB.

O módulo KV Storage é resolvido conforme definido na iniciativa Biblioteca Padrão do JavaScript e seu suporte para mapas de importação.

Os mapas de importação não são um conceito novo e faziam parte de sistemas de módulos JavaScript anteriores, como AMD e sistemas de módulos em outras linguagens de programação. Sua inclusão com módulos ES padrão é nova. Essa proposta de mapas de importação fornece controle sobre as URLs obtidas por instruções de importação JavaScript e expressões import () e permite que o mapeamento seja reutilizado em contextos que não são de importação. Os mapas de importação permitem instruções de importação simplificadas, resoluções de módulo de fallback, polyfills para módulos internos e compartilhamento de contextos entre as tags de busca, de imagem e de link e muito mais.

A implementação bem-sucedida desses dois novos recursos altamente esperados deve melhorar significativamente o processo pelo qual os recursos são adicionados a versões futuras do JavaScript e fornecer APIs da Web adicionais convenientes. Importar mapas e módulos embutidos se esforçam para resolver uma parte faltante do manifesto web extensível.

Os desenvolvedores que desejam experimentar hoje com armazenamento KV pode alavancar o polyfill, ou instalar um Dev Chrome ou a versão Canárias de Chrome 74. Antes do lançamento dominante desses recursos, os desenvolvedores podem tornar esses recursos disponíveis para todos os usuários Chrome 74+ para domínios específicos, registando interesse no teste de original do Armazenamento KV.

Publicado em

Google está procurando Devs JS

A Google continua seus esforços para o desenvolvimento do Fuchsia. Se você não ouviu falar segue um resumo:

Ao contrário de sistemas operacionais anteriores desenvolvidos pelo Google, como o Chrome OS e o Android, que são baseados no kernel Linux, Fuchsia é baseado em um novo microkernel chamado Zircon (o nome anterior era Magenta), derivado do Little Kernel, que foi destinado para sistemas embarcados e é principalmente escrito em C. Fuchsia foi projetado para ser executado em uma infinidade de dispositivos, incluindo telefones celulares e computadores pessoais.

Fonte: https://pt.wikipedia.org/wiki/Google_Fuchsia

De acordo com uma postagem feita no Twitter pelo desenvolvedor Yang Guo, a Google está procurando um engenheiro de software para trabalhar na Alemanha e ajudar o Fuchsia a rodar JavaScript, já que a vaga pede conhecimentos em Node.js, C++ e C++ toolchain. Segue uma tradução da postagem

Para elaborar um pouco:
– A “nova plataforma” é fúcsia.
– A posição é uma posição de engenheiro de software em tempo integral no Google Munique.
– Eu não estou considerando remoto neste momento.
– A experiência com o desenvolvimento principal do Node.js, C ++ e C ++ toolchain seria útil.

Fonte: https://twitter.com/hashseed/status/1108016705920364544

O fato de a Google estar procurando alguém para tornar o Fuchsia compatível com JavaScript não é uma surpresa, já que, de acordo com a Pesquisa Stack Overflow Developer 2018, o JavaScript é a linguagem mais utilizada do mundo, com quase 70% dos desenvolvedores que participaram da pesquisa afirmando que estão trabalhando em pelo menos uma aplicação com ela.

A novidade é que, até então, a equipe do Fuchsia estava trabalhando baseado no JavaScriptCore, utilizado principalmente pela Apple, e deixando de lado o Node.js, que é usado por grande parte dos desenvolvedores e é a base de aplicações para web voltadas para desktop, como o app do Slack.

Ainda que o Node.js não dê suporte oficial a aplicações para Android, o fato de ele ser usado em diversos aplicativos para desktop o torna importante para o funcionamento do Fuchsia, e a Google parece pensar a mesma coisa sobre o caso. Então garantir o suporte a mais uma linguagem só ajudará a empresa a fazer com que mais desenvolvedores se interessem por utilizar o Fuchsia.

Fontes:

https://br.noticias.yahoo.com/google-est%C3%A1-contratando-desenvolvedores-javascript-161400421.html

https://canaltech.com.br/android/google-esta-contratando-desenvolvedores-javascript-para-o-fuchsia-135345/?utm_source=yahoo&utm_campaign=parceiro-feed&utm_medium=rss