{"id":1841,"date":"2019-03-18T08:37:48","date_gmt":"2019-03-18T11:37:48","guid":{"rendered":"http:\/\/www.milfont.org\/tech\/2019\/03\/18\/tendencias-sobre-frameworks-javascript-em-2019\/"},"modified":"2019-03-18T08:37:48","modified_gmt":"2019-03-18T11:37:48","slug":"tendencias-sobre-frameworks-javascript-em-2019","status":"publish","type":"post","link":"https:\/\/www.milfont.org\/tech\/2019\/03\/18\/tendencias-sobre-frameworks-javascript-em-2019\/","title":{"rendered":"Tend\u00eancias sobre Frameworks Javascript em 2019"},"content":{"rendered":"<p>Preciso tomar decis\u00f5es racionais em prol do neg\u00f3cio no papel de gestor que isentam gostos pessoais ou Feeling.<\/p>\n<p>Coordenar junto ao time de tecnologia a escolha de ferramentas na estrat\u00e9gia da empresa para orientar que essa decis\u00e3o seja sensata, \u00e9 uma delas.<\/p>\n<p>O mundo Front-end \u00e9 o mais cruel, a cada dois ou tr\u00eas anos voc\u00ea praticamente precisa se programar pra reescrever tudo, sempre!<\/p>\n<figure>\n<p><img decoding=\"async\" data-width=\"1912\" data-height=\"687\" src=\"https:\/\/cdn-images-1.medium.com\/max\/2560\/1*71GUKJIlGMX33WlDNm3Www.png\"><br \/>\n<\/figure>\n<h4>Como escolher corretamente para a organiza\u00e7\u00e3o?<\/h4>\n<p>Entre os fatores que preciso orientar, est\u00e3o: facilidade de contrata\u00e7\u00e3o (oferta abundante de bons profissionais), produtividade na tecnologia (quantidade de materiais, tutoriais e libs), evolu\u00e7\u00e3o da plataforma (qualidade do ecossistema).<\/p>\n<p>Como o Front-end \u00e9 extremament vol\u00e1til, quando voc\u00ea come\u00e7a a decidir qual plataforma ser\u00e1 utilizada para a pr\u00f3xima meia d\u00e9cada j\u00e1 est\u00e1 pelo menos um ano atrasado no mundo corporativo que \u00e9 mais lento pelo pr\u00f3prio tamanho das empresas.<\/p>\n<h4>Foco na\u00a0entrega<\/h4>\n<p>Dado um entreg\u00e1vel em um intervalo de tempo e o planejamento de sua sustenta\u00e7\u00e3o com seguida evolu\u00e7\u00e3o, preciso estabelecer dados para me guiar nessa escolha.<\/p>\n<p>Alguns indicadores famosos no mercado Javascript como <a href=\"https:\/\/2018.stateofjs.com\/front-end-frameworks\/overview\/\" target=\"_blank\" rel=\"noopener noreferrer\">State of Js<\/a>, <a href=\"https:\/\/www.jetbrains.com\/research\/devecosystem-2018\/javascript\/\" target=\"_blank\" rel=\"noopener noreferrer\">The State of Developer Ecosystem (da Jetbrains)<\/a> e <a href=\"https:\/\/insights.stackoverflow.com\/survey\/2018\" target=\"_blank\" rel=\"noopener noreferrer\">Developer Surveys (da Stackoverflow)<\/a> determinam que praticamente os 3 maiores na prefer\u00eancia e uso s\u00e3o Angular, React e Vuejs.<\/p>\n<p>Coletando informa\u00e7\u00f5es do Google Trends para essas 3 libs, temos:<\/p>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1710\" data-height=\"510\" src=\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*lW-EWbUWD28Hk7axVShblA.png\"><figcaption class=\"wp-caption-text\">Google Trends com filtro global <a href=\"https:\/\/trends.google.com\/trends\/explore?q=%2Fg%2F11c6w0ddw9,%2Fm%2F012l1vxv,Vuejs\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/trends.google.com\/trends\/explore?q=%2Fg%2F11c6w0ddw9,%2Fm%2F012l1vxv,Vuejs<\/a><\/figcaption><\/figure>\n<p>Observo ainda uma constante busca na cont\u00ednua prefer\u00eancia para o React que grandes players mundiais usam como o grupo Facebook (Facebook, Instagram e WhatsApp), AirBnb, Netflix, Twitter, Walmart (USA), etc.<\/p>\n<h4>Tend\u00eancias do mercado\u00a0local<\/h4>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1708\" data-height=\"602\" src=\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*Qga4YzLXbe7AQI8y_XtVQw.png\"><figcaption class=\"wp-caption-text\">Google Trends com filtro Brazil <a href=\"https:\/\/trends.google.com\/trends\/explore?geo=BR&amp;q=%2Fg%2F11c6w0ddw9,%2Fm%2F012l1vxv,Vuejs\" target=\"_blank\" rel=\"noopener noreferrer\">https:\/\/trends.google.com\/trends\/explore?geo=BR&amp;q=%2Fg%2F11c6w0ddw9,%2Fm%2F012l1vxv,Vuejs<\/a><\/figcaption><\/figure>\n<p>Vuejs parece ter um crescimento maior no Br do que no resto do mundo, apesar de menor em rela\u00e7\u00e3o aos outros dois concorrentes, tem uma <a href=\"https:\/\/github.com\/vuejs-br\/empresas-que-usam-vue-no-brasil\" target=\"_blank\" rel=\"noopener noreferrer\">lista de empresas que utilizam por aqui que voc\u00ea pode acompanhar nessa conta do Github<\/a>.<\/p>\n<p>N\u00e3o conferi a acur\u00e1cia, mas a primeira grande empresa da lista que peguei pra conferir (O Botic\u00e1rio) n\u00e3o est\u00e1 em produ\u00e7\u00e3o condizente com a lista.<\/p>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1909\" data-height=\"776\" src=\"https:\/\/cdn-images-1.medium.com\/max\/1200\/1*WXBLq55uNfDToj53zDYwyw.png\"><figcaption class=\"wp-caption-text\">Botic\u00e1rio em produ\u00e7\u00e3o usa React na\u00a0Home<\/figcaption><\/figure>\n<h4>Grandes Players no\u00a0Brasil?<\/h4>\n<p>Um ecossistema moderno requer SPA e Server Side Renderer. Um grande Player na gritante maioria das vezes precisa integrar ferramentas internas e produtos de terceiros, espere poucos que ser\u00e3o homog\u00eaneos.<\/p>\n<p>Filtrando pelos maiores varejistas generalistas para estabelecer um grupo de controle nessas condi\u00e7\u00f5es, temos Magazine Luiza, B2W (Americanas e Submarino), Mercado Livre, Carrefour e Walmart. Deixei o grupo Via Varejo de fora (Casas Bahia, Ponto Frio e Extra.com) dessa an\u00e1lise r\u00e1pida.<\/p>\n<p>Existe tamb\u00e9m uma <a href=\"https:\/\/github.com\/react-brasil\/empresas-que-usam-react-no-brasil\" target=\"_blank\" rel=\"noopener noreferrer\">lista de empresas que usam React mantido pela comunidade de desenvolvedores nessa conta do Github.<\/a><\/p>\n<p>Carrefour e Walmart Brasil n\u00e3o parecem ter algum desses 3 escolhidos, a n\u00e3o ser que seja apenas no SSR, n\u00e3o consegui identificar (foi muito superficial a an\u00e1lise). Magazine, B2W e Mercado Livre escolheram React seguindo essa tend\u00eancia mundial e local.<\/p>\n<p>Aqui n\u00e3o entrei no ju\u00edzo de valores sobre o que \u00e9 feito em casa ou de terceiros, afinal a contrata\u00e7\u00e3o ser\u00e1 de profissionais que entendam a tecnologia para construir ou no m\u00ednimo para integrar.<\/p>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1907\" data-height=\"975\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*TPwKkwqIh8BbQNh2waqzyA.png\"><figcaption class=\"wp-caption-text\">Magazine Luiza j\u00e1 tem alguns m\u00f3dulos e p\u00e1ginas constru\u00eddos com\u00a0React<\/figcaption><\/figure>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1524\" data-height=\"601\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*LiAiP0Kvq_dzjLMZ31yCTw.png\"><figcaption class=\"wp-caption-text\">Inclusive parece ter legado de estrutura feita em\u00a0React<\/figcaption><\/figure>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1903\" data-height=\"970\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*uyq0gTe3wYjb_inLf3wBLg.png\"><figcaption class=\"wp-caption-text\">Americanas (B2W) tamb\u00e9m est\u00e1 em produ\u00e7\u00e3o com\u00a0React<\/figcaption><\/figure>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1918\" data-height=\"888\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*DYWYHI1bUBSH1_3FVI6A3A.png\"><figcaption class=\"wp-caption-text\">Submarino (B2W)<\/figcaption><\/figure>\n<figure class=\"wp-caption\">\n<p><img decoding=\"async\" data-width=\"1899\" data-height=\"957\" src=\"https:\/\/cdn-images-1.medium.com\/max\/800\/1*OvXL_oUy3uM-Qve-qfT5wA.png\"><figcaption class=\"wp-caption-text\">Mercado Livre\u00a0tamb\u00e9m<\/figcaption><\/figure>\n<h4>Siga o Mestre e Apelo a autoridade<\/h4>\n<p>N\u00e3o se trata de fal\u00e1cia ao observar tend\u00eancias, mas elementos \u00f3bvios que se o mercado onde voc\u00ea atua tem uma maior gama de profissionais em uma dada tecnologia, ter\u00e1 mais gente treinada dispon\u00edvel para contrata\u00e7\u00e3o que por consequ\u00eancia deve impor um mercado de treinamento junto. Al\u00e9m de utiliza\u00e7\u00e3o de bibliotecas em comum que estar\u00e3o mais maduras.<\/p>\n<p>Se um n\u00famero isolado fosse determinante, todo mundo seguiria com Angular por ter mais tempo e o que tem mais profissionais no mercado, \u00e9 o cruzamento das informa\u00e7\u00f5es.<\/p>\n<p>Nesse contexto React tem uma maior procura e est\u00e1 na estrat\u00e9gia de um grupo consider\u00e1vel de grandes Players.<\/p>\n<h4>Desenvolvimento profissional<\/h4>\n<p>Nessa escolha alguns fatores sobre dados absolutos podem n\u00e3o fazer sentido, exemplo: \u201co sistema atual \u00e9 em Angular e todos os profissionais s\u00e3o proeficientes nessa tecnologia\u201d.<\/p>\n<p>Contexto \u00e9 tudo, dado o planejamento a m\u00e9dio e longo prazo, sai mais barato treinar todo mundo numa plataforma que fa\u00e7a sentido do que manter o Status Quo porque um n\u00famero isolado indica um caminho c\u00f4modo.<\/p>\n<h4>Alguns profissionais podem n\u00e3o se adaptarem<\/h4>\n<p>Decis\u00f5es racionais s\u00e3o necess\u00e1rias pra empresa, n\u00e3o necessariamente para os profissionais, n\u00e3o vejo problema algum em um profissional se fixar em uma \u00fanica tecnologia e determinar esse caminho pra sua carreira.<\/p>\n<p>Como gestor voc\u00ea tem que saber que independente da escolha que far\u00e1, poder\u00e1 perder alguns desses profissionais.<\/p>\n<p>Como profissional voc\u00ea pode considerar conhecer e ser treinado na maior quantidade poss\u00edvel de ecossistemas que s\u00e3o tend\u00eancias, sua expertise ser\u00e1 aprimorada, mas como falei, vai da inten\u00e7\u00e3o de cada um.<\/p>\n<h4>Ent\u00e3o, n\u00e3o devo experimentar Vuejs?<\/h4>\n<p><a href=\"https:\/\/medium.com\/@milfont\/radar-front-end-2018-51a185f4eb41\" target=\"_blank\" rel=\"noopener noreferrer\">A an\u00e1lise que fiz no final de 2017 para o ano de 2018 ainda segue muito v\u00e1lida<\/a>.<\/p>\n<p>React e Vuejs seguem diretrizes, princ\u00edpios e valores muito pr\u00f3ximos, o que os difere \u00e9 na forma em pequenos detalhes. Se a estrat\u00e9gia de evolu\u00e7\u00e3o contemplar um pensamento em Microfrontends e padr\u00f5es que sigam a integra\u00e7\u00e3o entre ambos, manter um time polivalente pode render uma inova\u00e7\u00e3o frente aos concorrentes e uma oportunidade de investir em uma frente caso a outra entre em obsolesc\u00eancia.<\/p>\n<p>Mas o experimento de abrir o ambiente a v\u00e1rias tecnologias tamb\u00e9m tr\u00e1s o risco de pulverizar esfor\u00e7o. O Tradeoff aqui requer uma dose de coragem al\u00e9m da experi\u00eancia.<\/p>\n<h4>E o\u00a0tl;dr?<\/h4>\n<p>Em um grande resumo disso tudo \u00e9, o mercado tende a continuar investindo em React, se voc\u00ea tem gente experiente o suficiente, vale a pena abrir mais de uma trincheira. Mas como conselho geral, treine seu time, fortale\u00e7a e construa uma arquitetura s\u00f3lida primeiro em React.<\/p>\n<p>Pra finalizar eu creio que vale a pena rever (se ainda n\u00e3o viu) essa palestra curtinha que eu e a <a href=\"https:\/\/twitter.com\/ketemr\" target=\"_blank\" rel=\"noopener noreferrer\">Kete<\/a> fizemos no <a href=\"https:\/\/www.infoq.com\/br\/presentations\/transformando-um-front-end-legado-em-uma-react-spa\" target=\"_blank\" rel=\"noopener noreferrer\">React Brazil 2017<\/a> sobre evolu\u00e7\u00e3o de plataformas javascript.<\/p>\n<p><iframe class='youtube-player' type='text\/html' width='450' height='254' src='https:\/\/www.youtube.com\/embed\/uR5oGnj0wYE?version=3&#038;rel=1&#038;fs=1&#038;autohide=2&#038;showsearch=0&#038;showinfo=1&#038;iv_load_policy=1&#038;wmode=transparent' allowfullscreen='true' style='border:0;'><\/iframe><\/p>\n","protected":false},"excerpt":{"rendered":"<p>Preciso tomar decis\u00f5es racionais em prol do neg\u00f3cio no papel de gestor que isentam gostos pessoais ou Feeling. Coordenar junto ao time de tecnologia a escolha de ferramentas na estrat\u00e9gia da empresa para orientar que essa decis\u00e3o seja sensata, \u00e9 uma delas. O mundo Front-end \u00e9 o mais cruel, a cada dois ou tr\u00eas anos [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":[],"categories":[424],"tags":[],"_links":{"self":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/posts\/1841"}],"collection":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/comments?post=1841"}],"version-history":[{"count":0,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/posts\/1841\/revisions"}],"wp:attachment":[{"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/media?parent=1841"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/categories?post=1841"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.milfont.org\/tech\/wp-json\/wp\/v2\/tags?post=1841"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}