book

Aprendendo padrões de design JavaScript, 2ª edição

by Addy Osmani

April 2025

Intermediate to advanced

298 pages

7h 13m

Portuguese (Portugal, Brazil)

O'Reilly Media, Inc.

Book available

Read now

Unlock full access

Estrutura do livroConvenções utilizadas neste livroUtilizar exemplos de códigoAprendizagem em linha da O'ReillyComo contactar-nosAgradecimentos
História dos padrões de designO que é um padrão?Um caso de uso diário para padrões de designResumo
O que são proto-padrões?Os testes de "padrãoRegra de trêsResumo
A estrutura de um padrão de designPadrões bem escritosEscrever um padrãoResumo
O que são Anti-Padrões?Anti-padrões em JavaScriptResumo
A importância de dissociar aplicaçõesMódulos com Importações e ExportaçõesObjectos do móduloMódulos carregados de fontes remotasImportações estáticasImportações dinâmicasImportar na InteraçãoImportar sobre a visibilidadeMódulos para o servidorVantagens da utilização de módulosClasses com construtores, getters e settersClasses em Frameworks JavaScriptResumoLeitura relacionada
AntecedentesPadrões de design criativoPadrões de design estruturalPadrões de design comportamentalClasses de padrões de designResumo
Padrões de criaçãoO padrão do construtorCriação de objectosConstrutores básicosConstrutores com protótiposO padrão do móduloLiterais de objetoO padrão do móduloVariações do padrão do móduloPadrão de módulo moderno com WeakMapMódulos com bibliotecas modernasO padrão do módulo reveladorVantagensDesvantagensO padrão SingletonGestão de estados em ReactO padrão do protótipoO padrão de fábricaQuando utilizar o padrão de fábricaQuando não deves utilizar o padrão de fábricaFábricas de abstraçãoPadrões estruturaisO padrão da fachadaO padrão MixinSubclassificaçãoMixinsVantagens e desvantagensO Padrão DecoradorDecoradores pseudoclássicosInterfacesDecoradores abstractosVantagens e desvantagensPeso moscaUtilizar pesos-moscasPesos-moscas e partilha de dadosImplementação de pesos-moscas clássicosConvertendo código para usar o padrão FlyweightUma fábrica básicaGerir os estados extrínsecosO padrão Flyweight e o DOMExemplo: Tratamento centralizado de eventosPadrões de comportamentoO padrão do observadorDiferenças entre o padrão Observer e Publish/SubscribeVantagensDesvantagensImplementações Publish/SubscribeO padrão do mediadorUm simples mediadorSemelhanças e diferençasUtilização do agregador de eventosUtilização do mediadorAgregador de eventos (Pub/Sub) e Mediador em conjuntoMediator/Middleware em JavaScript modernoMediador versus fachadaO padrão de comandoResumo
MVCMVC do Smalltalk-80MVC para programadores JavaScriptModelosVisualizaçõesCriação de modelosControladoresO que é que o MVC nos dá?Smalltalk-80 MVC em JavaScriptResumo do MVCMVPModelos, pontos de vista e apresentadoresMVP ou MVC?MVVMHistóriaModeloVêViewModelRecapitula: A Vista e o ViewModelViewModel Versus ModelPrós e contrasVantagensDesvantagensMVC versus MVP versus MVVMPadrões MV* modernosMV* e React.jsResumo
Programação assíncronaAntecedentesPadrões de promessaEncadeamento de promessasTratamento de erros da promessaPromete o paralelismoPromete a execução sequencialMemoização da promessaPipeline da PromessaPromete repetirDecorador de promessasCorrida Promessapadrões async/awaitComposição de funções assíncronasIteração assíncronaTratamento de erros assíncronoParalelismo assíncronoExecução sequencial assíncronaMemoização assíncronaTratamento de eventos assíncronosPipeline async/awaitrepetição assíncronaDecorador async/awaitExemplos práticos adicionaisFazer um pedido HTTPLendo um arquivo do sistema de arquivosEscrevendo em um arquivo no sistema de arquivosExecução de várias operações assíncronasExecução de várias operações assíncronas em sequênciaColocar em cache o resultado de uma operação assíncronaManipulação de eventos com async/awaitTentar novamente uma operação assíncrona em caso de falhaCriando um Decorador async/awaitResumo

Uma nota sobre carregadores de scriptsAMDComeçar a utilizar os módulosMódulos AMD com jQueryConclusões da AMDCommonJSComeçar a trabalharConsumindo várias dependênciasCommonJS em Node.jsO CommonJS é adequado para o navegador?Leitura relacionada com o CommonJSAMD e CommonJS: padrões concorrentes, mas igualmente válidosUMD: Módulos compatíveis com AMD e CommonJS para plug-insResumo
Fundamentos de NamespacingVariáveis globais únicasNamespacing do prefixoNotação Literal de ObjetoEspaçamento de nomes aninhadoExpressões de função imediatamente invocadasInjeção de NamespacePadrões Avançados de NamespacingAutomatizando o espaçamento de nomes aninhadoPadrão de declaração de dependênciaExtensão Deep ObjectRecomendaçãoResumo
Uma introdução ao ReactTerminologia utilizadaConceitos básicosComponentes de ordem superiorComposiçãoPrósContrasPadrão de adereços de renderizaçãoEstado de elevaçãoAs crianças como uma funçãoPrósContrasPadrão de ganchosComponentes de classeReestruturaçãoComplexidadeGanchosGancho estatalGancho de efeitoGanchos personalizadosOrientação para ganchos adicionaisPrós e contras da utilização de ganchosReact Hooks Versus ClassesImportação estáticaImportação dinâmicaComponentes carregáveisImportar na InteraçãoImportar sobre a visibilidadeDivisão de códigosDivisão baseada na rotaSeparação de pacotesPadrão PRPLDefinição de prioridades de carregamentoPré-carregamento em aplicações de página únicaPré-carregamento + o Hack assíncronoPré-carregamento no Chrome 95+Virtualização de listasComo funciona o Windows/Virtualização?ListasGrelhaMelhorias na plataforma WebConclusõesResumo
Importância dos padrões de renderizaçãoRenderização do lado do clienteRenderização do lado do servidorRenderização estáticaRegeneração estática incrementalISR a pedidoResumo da renderização estáticaTransmissão em fluxo contínuo de SSRBorda SSRRenderização híbridaHidratação progressivaArquitetura das ilhasIlhas de implementaçãoPrós e contrasComponentes do React ServerRenderização híbrida com RSC e o Next.js App RouterResumo
IntroduçãoAgrupa por módulo, caraterística ou rotaAgrupa por tipo de ficheiroAgrupamento híbrido baseado no domínio e nos componentes comunsEstrutura de aplicação para recursos modernos do ReactReduxContentoresGanchosComponentes com estiloOutras boas práticasEstrutura de aplicação para aplicações Next.jsResumo

Overview

Este trabalho foi traduzido com recurso a IA. Agradecemos o teu feedback e comentários: translation-feedback@oreilly.com

Queres escrever JavaScript bonito, estruturado e de fácil manutenção, aplicando padrões de design modernos à linguagem? Queres um código limpo, eficiente e gerível? Queres manter-te atualizado com as melhores práticas mais recentes? Se assim for, a segunda edição atualizada de Learning JavaScript Design Patterns é o lugar ideal para começar.

O autor Addy Osmani mostra-te como aplicar padrões de design modernos ao JavaScript e ao React - incluindo módulos, mixins, observers e mediadores. Aprenderás sobre padrões de desempenho e renderização, como a renderização do lado do servidor e a arquitetura Islands. Também aprenderás como os padrões de arquitetura como MVC, MVP e MVVM são úteis da perspetiva de um desenvolvedor de aplicativos da Web moderno.

Este livro explora:

Padrões de arquitetura para estruturar os teus componentes e aplicações
Mais de 20 padrões de design em JavaScript e React, aplicáveis a programadores de qualquer nível
Diferentes categorias de padrões, incluindo criativos, estruturais e comportamentais
Padrões de desempenho essenciais, incluindo importações dinâmicas e divisão de código
Padrões de renderização, como renderização do lado do servidor, hidratação, arquitetura de ilhas e muito mais

Além disso, explorarás a sintaxe JavaScript moderna, como módulos JavaScript, padrões React, como Hooks, componentes de ordem superior (HOCs) e muito mais, para te manteres à frente no mundo em constante evolução do desenvolvimento Web.