Universal JS

[sbvorpagel]

Pessoal, vocês tiveram experiências com Universal JS?
Quais as melhores práticas?
Vocês conhecem cases de uso?
Estou fazendo algumas experimentações sobre o assunto e gostaria de ver as experiências de vocês.

Desde já muito obrigado :D

[fdaciuk]

Então, o ponto principal de pra tentar escrever JS Universal é basicamente não usar objetos específicos de ambientes =)

No mais, separar features em funções e mantê-las puras vai ajudar a evitar bugs, mas pra ser Universal é só escrever JS puro, sem uso de APIs / ferramentas / objetos / coisas específicas de ambientes, que ele já pode ser considerado "Universal" xD

[munizart]

Alguns frameworks te ajudam bastante nisso, você cuida da logica em si escrevendo funções puras e o framework cuida das coisas especificas pra plataforma (como I/O, por exemplo) um bom exemplo é o cycle.js (que eu pessoalmente não gosto de como o código fica)

[sbvorpagel]

@fdaciuk tb acredito nisso, começando pela parte mais interna e deixando a casca (comunicação para com o exterior) bem separada, te garante que possa usar essas camadas em vários ecossistemas, mudando apenas o exterior.

@munizart não conhecia essa lib, darei uma olhada muito obrigado.

Quanto a comunicação de uma API REST com uma página. Seguindo um paradigma universal o código seria executado no browser e depois sincronizada com o servidor. Ou vocês vêem outra alternativa?

[fdaciuk]

Quanto a comunicação de uma API REST com uma página. Seguindo um paradigma universal o código seria executado no browser e depois sincronizada com o servidor. Ou vocês vêem outra alternativa?

Não entendi muito bem a questão. Usar código "universal" não faz disso um paradigma. O ponto principal de escrever código universal é o reuso do mesmo em qualquer ambiente. Como a aplicação vai funcionar, vai depender do seu projeto em específico, não tem a ver com o código ser universal ou não =)

[munizart]

@sbvorpagel acho que um exemplo pode clarificar aqui,

Você pode ter como exemplo o axios, que é uma lib pra requests que funciona em varios ambientes.
Mesmo assim, pra cada ambiente, é necessário um driver, isto é, uma construção de codigo (função, objeto, "classe", etc) que fará a interface entre o que o nucleo do axios precisa com a interface de requests daquela plataforma (XHR pra web, modulo http no node, etc...)

Código especifico pra cada plataforma sempre vai existir, pq as plataformas não fazem as mesmas coisas da mesma forma, a ideia de ter código universal é ter um núcleo que interage com interfaces definidas e que não espera nada especifico de uma plataforma e pra cada plataforma que você precisar operar escrever um driver/adapter pra "traduzir" a interface daquela plataforma pra interface que o núcleo espera.

A ideia principal, é que teu software tenha a maior parte de código agnóstico a plataforma possível e ir "empurrando pras pontas" a necessidade de conhecer a plataforma, delegando isso pra pedaços de códigos que possam ser trocados. Assim quando você muda de uma plataforma pra outra todo a parte central do código é reutilizada e você só precisa escrever os drives novos.
É assim que muitos sistemas operacionais lidam com a variedade quase infinita de dispositivos diferente que servem pra mesma coisa, como mouse, teclados, HD e outros. Quando você troca de dispositivo todo que teu SO precisa fazer é instalar um novo driver...

Agora, pra deixar universal, é só você delegar a responsabilidade de prover o driver pra quem estiver utilizando e exportar apenas o core daquele codigo na lib. (você também pode criar as libs só com os drivers e quem for utilizar importa só o que precisar)

[ninetails]

Bom, não comentei antes pq fiquei pensando se Universal JS seria o antigo isomórfico ou se alguma lib/framework nova de Javascript Fatigue... Se tratando do primeiro:

A maioria da minha experiência sobre o assunto foi em relação a React SSR. Dizem que VueJS também tá legal usando o Nuxt. Também nunca ouvi falarem sobre o assunto fora das Frameworks, visto que o termo veio depois de React SSR & React Native.

Não tive muita experiência na parte da view, mas o pouco que estudei sobre o SSR eu diria que antes de tudo precisaria ver mesmo se vale a pena implementar, pois é algo que vai demandar mais tempo, mais spec/curva de aprendizado e requer mais dos desenvolvedores (fora testar e funcionar em todos os ambientes). Mesmo com diversas bibliotecas que lidam tanto com react-native+web ou axios (mas ainda sim prefiro cross-fetch), ainda sim vai precisar dar muita volta pra ter um código reusável para ambas as plataformas. O exemplo mais claro para mim é que entre web e SSR, vc pode ter o mesmo código fazendo fetch porém no servidor vai precisar que o fetch seja feito de antemão antes de mostrar os dados. Também não cheguei a desenvolver para mobile, mas li que estilizar para eles não seria tão trivial, teria também que "adaptar". Fora também o problema talvez de code splitting (só pra web) e como organizar os arquivos.

Mesmo falando sobre frameworks, ainda acho que manteria válido o que falei sobre Universal Rendering antes do react-native (usando o bom e velho handlebars/mustache) :D