Qual é a dinâmica
Hoje no terminal móvel, especialmente como tal telefone um Taobao App, a dinâmica do problema está se tornando um problema mais difícil. A chamada dinâmica, é otimizar a flexibilidade do próprio aplicativo móvel, ciclos de atualização iterativos e custos ao extremo. Tais como telefones celulares loja home page Taobao, o que permite que as empresas em tempo real para decorar sua loja, atualizar os seus próprios produtos, eventos e outras informações; outro exemplo Taobao, Tmall todos os principais página pro local, pergunte-nos informações da interface de ajuste muito flexível e atempada e status para assegurar que, em um ritmo que muda rapidamente do dia, seguida de acordo promocional com várias contingências.
Porque para resolver problemas dinâmicos
Surgimento de demanda dinâmica há muitos fatores inevitáveis: por trás do nosso aplicativo móvel é um nível de plataforma e até mesmo sistema de fornecedor elétrico eco-nível, ele precisa ser tolerante com a diversidade de capacidades e características de fluxo de alta velocidade, o mercado muitas aplicações móveis têm um objetivo semelhante forma e apela, ao mesmo tempo em toda a indústria até agora acumulada no terminal móvel não são suficientes para formar o produto, experiência do usuário, interação e outros detalhes têm compreensão completa cedo, uma aplicação móvel, você precisa experimentar e explorar de forma mais objetiva, e mesmo "tentativa e erro", e essa evolução dinâmica da extensão e velocidade de iterações de produtos têm uma forte correlação positiva, em terceiro lugar, não temos essa dinâmica mais esforço em final repetida, não devemos, portanto, freqüentemente desencadear uma nova versão. Então, a dinâmica da questão é particularmente importante em terminais móveis de hoje.
dinâmica histórica do problema
A natureza dinâmica do problema não é apenas específica para o terminal móvel, na longa história de desenvolvimento tecnológico da Internet, desktop e há também experimentando coisas semelhantes. conclusão de desktop de hoje parece ter sido formado, e que é W3C muito defende WebPlatform (ou referido ou HTML5 Web App ou navegador), mas também passou para a diferenciação plataforma, plug-in nativo suporte (flash player), o desempenho do dispositivo renderização processo de otimização de motor.
No lado móvel, Alibaba é a divisão sem fio, equipe de irmãos, e toda a indústria está fazendo todos os tipos de experiência e prática positiva:
solução híbrida: para o recipiente WebView para HTML5 como a pedra angular, expandindo a definição de recursos nativos para o apoio ao desenvolvimento do produto dinâmico, tais como recipiente chamado Windvane telefone interno Taobao, tais programas geralmente têm uma resistência muito alta dinâmica, mas problemas e própria dinâmica como óbvio, e que é a falta de resultados de desempenho e mostra, mas quer dar a desempenhar plenamente as suas vantagens no projeto, o desenvolvedor acumulado conhecimento e experiência no front-end também têm requisitos mais altos, espaço não muito de expansão limitada.
Estruturada Programa Ver nativa: Vista a um recipiente para nível nativo renderização nativa, e definir um conjunto de vista do formato de descrição de estrutura de dados (como XML ou similar o JSON), e depois por alterar dinamicamente o pedido ou uma nova informação de dados para alcançar tal dinâmica efeitos de interface, como ocorre no Alibaba Group, (sobre) o WeApp, ninho de pássaro, Dynative, PageKit, etc. tais programas dependem de uma descrição da interface estruturado, e concentrando-se em dimensões de saída de proteção puro espectáculo dinâmico, diferente, mas há alguns deficiências comuns, tais como o processamento dinâmico de outras dimensões, tal como a lógica dinâmico, estratégia e outras cargas dinâmicas.
Reagir programa nativo: ele foi usado como um curto RN, é nativo para o motor de renderização, por meio da conversão e lógica de controle suportes de motor scripting a interface DOM Virtual, para alcançar interface dinâmica. RN Ali na primeira metade da equipe ter sido um monte de prática, incluindo a divisão wireless onde eu estava, mas o efeito não é satisfatória, a primeira ordem de grandeza é RN muito pesado, a pedido, carregamento, renderização, interação, estabilidade e outros aspectos são não é o ideal, e toda a soluções técnicas em um processo iterativo e a evolução da comunidade tem sido cheio de incertezas, o que dá à equipe o nível de utilização do produto follow-up e postar uma grande confusão.
Na verdade, nós sentimos que RN é mais como um novo quadro de desenvolvimento móvel, ao invés de melhorar a dinâmica das aplicações móveis existentes para nós. Esperamos resolver o problema através RN dinâmica, porque introduz apenas o motor de JavaScript cliente.
Reconsideração de sistemas dinâmicos laterais móvel: weex
Em resumo, podemos ver um monte de solução dinâmica do problema, mas também cada um tem os seus limites. Equipe através da observação contínua e discussão, decidiu vir para cima com uma melhor e mais técnico soluções para problema dinâmica de terminais móveis - que é a weex!
conceitos de design e processos de pensamento de weex
Weex em nossa opinião já tem tantos recursos, tais como:
致力于移动端，充分调度 native 的能力
充分解决或回避性能瓶颈
灵活扩展，多端统一，优雅“降级”到 HTML5
保持较低的开发成本和学习成本
快速迭代，轻量实时发布
融入现有的 native 技术体系
工程化管理和监控等
……
Mas weex fato, as demandas do núcleo é resolver o problema do final movimento dinâmico, tem suas próprias muito distintas três características:
Leve: tamanho pequeno, sintaxe simples, fácil acesso e ao uso
personalização serviço só lateralmente ao centro dos componentes e módulos funcionais: Scalable
Alto desempenho: carga de alta velocidade, processamento de alta velocidade, experiência suave
Weex para o problema dinâmica de terminais móveis nascido, estas vantagens são naturais, a busca da final. Equipe projetou e implementou um conjunto de soluções técnicas com base nesses três aspectos.
Equipe na concepção e prática de weex, há um sentimento muito profundo, é esta: para encontrar um equilíbrio entre desempenho e dinâmica.
Olhando para a dinâmica de tantas soluções técnicas, a única maneira há tão poucos:
Desenvolvimento / configuração de conteúdo dinâmico
dinâmica de implantação de conteúdo de cloud
pedidos do cliente para conteúdo dinâmico
de conteúdo dinâmico cliente resultados prontos-de-final
Se nós não apenas lidar com a natureza dinâmica do conteúdo do espetáculo puro, em seguida, novamente adicionar um link necessário
Desenvolvimento / configuração conteúdo dinâmico
conteúdo dinâmico implementação de nuvem
pedidos de clientes conteúdo dinâmico
de cliente e conteúdo dinâmico analisado em vista lógico de
um cliente para mostrar o efeito de uma visão e alça interação do usuário final,
O que liga há expansão pena, que liga a necessidade de mais dinâmico, que faz parte de um gargalo de desempenho, é a chave para a solução. Pelo pensamento e discussão, descobrimos que:
Desenvolvimento / configurar as necessidades de conteúdo dinâmico para alcançar rapidamente
uma implantações de nuvem exigem tanto quanto possível do centro, lateralmente expansível
pedido do cliente requer a menor transmissão possível de dados, necessidade de minimizar rápido carregamento
de análise de conteúdo cliente requer dinâmica
dinâmica de resposta interativa cliente necessário , necessidade de minimizar ao centro, lateralmente expansível
prestação interface do cliente exigem alto desempenho, é necessário, tanto quanto possível do centro, lateralmente expansível
Portanto, nossa solução tem várias decisões importantes:
A quantidade de dados entre a configuração de desenvolvimento de conteúdo / implantação e requer uma conversão transformador Drive e capacidades de processamento, e pedidos de clientes experiência em desenvolvimento de balanceamento
As necessidades do cliente para ter motor de JavaScript, lógica manipulação dinâmica, a estratégia de carregamento dinâmico, e precisa ser resolvido para o trabalho no final complexo o mais cedo possível
Descrição do conteúdo dinâmico requer a separação, a proteção da estrutura de conteúdo complexo, estilo, dados, decomposable comportamento
renderização da interface cliente nativo requer recursos de renderização, garantia de desempenho
A fronteira entre nativo e JavaScript motor de renderização no DOM Virtual, tanto comunicar por convenção DOM virtual, em vez de modelo + dados ou outros limites para garantir um equilíbrio de prestação flexibilidade e desempenho
distribuição de conteúdo dinâmico, o acesso do cliente, montagem, necessidades JS API para escala de tudo, para proteger a luz suficiente núcleo weex, focado o suficiente, mas na verdade pode suportar mais cenários de negócios
núcleo weex detalhes da cadeia de trabalho
Weex filosofia de design do núcleo é um três soluções dinâmicas integradas terminais, estudantes nuvem em tempo real a publicação e implantação dinâmica, pré-análise de processamento modelo, estudantes front-end conseguir conteúdo dinâmico em JS Framework analisados e transformados em DOM Virtual, o cliente tornando a fornecer os alunos a alcançar e apoiar as características nativas, os estudantes de negócios próximos para desenvolver ou implementar conteúdo dinâmico pode ser configurado de acordo com DSL.
Weex no design DSL inspira-se fortemente em padrões da Web modelo compatível e escrita, estilo, roteiro de mainstream e amadurecer padrão MVVM, estamos aprendendo custos, hábitos desenvolvido considerando um monte de estudantes de negócios, para que os alunos de negócios pode rapidamente aprender e usar, e para garantir a padronização e legibilidade do código (agradecimentos especiais aqui para olhar Vue.js seu autor, especialmente chuva o rio, que estão no topo do design DSL e implementação de JS Framework ter feito uma profundidade de uso e aprender e processos de troca também se beneficiam com o autor do).
Em segundo lugar, a fim de melhorar o desempenho, reduzir os clientes de perda de propriedade, weex no lado do servidor para conseguir um trabalho DSL Transformer, pode ao mesmo tempo a liberação modelo, o código + CSS + JavaScript XML em alta pode uma pequena quantidade de dados a eficiência do JS Bundle, e armazenamento síncrona para a nuvem: como a web Server, CDN e assim por diante.
Mais uma vez, a fim de garantir a lógica de negócios dinâmico, weex no motor funcionar JavaScript do cliente a partir de um conjunto de pré-JS Framework, para ser responsável pela análise de toda a JS Bundle, eo fim nativa apenas responsável análise DOM Virtual e layout, a implementação de renderização da interface do usuário, e a realização do processamento de API subjacente comunicações de rede básicas, alfabetização documento e gesto.
Bem como para efetivamente melhorar a eficiência do trabalho, weex de JS Bundle pode conseguir três terminais de exibição de renderização multi-plataforma, estudantes de negócios podem desenvolver uma weex JS Bundle através de alcançar iOS / Android / HTML5 exibição normal de três terminais.
Todos os componentes nativos e JS API são todos modular, estudantes de negócios a capacidade de estender para o centro pode ser alcançado pelo registro de novos módulos e métodos.
Sobre a otimização do desempenho weex, bem como os seguintes detalhes:
1, JS-quadro, baseando-se na recolha de dados, que responde a atingir a camada de vista, em conjunto com o algoritmo de optimização camada diff, pode eficazmente operações do filtro e complexos cálculos redundante.
2, terminal de comunicação nativo, processo de análise DOM Virtual e layout implementação fio assíncrono ou similares, para evitar o entupimento do segmento.
3, a UI nós componentes para alcançar um processamento de multiplexação, e monitoramento e recuperação de recursos de imagem, efetivamente reduzir o uso de memória.
4, altas exigências em tempo real para processamento, weex permitir que terceiros para atingir necessidades de personalização nativas para garantir a experiência suave.
Figura: testes de desempenho chave weex e comparação de programas similares
Nota: Os dados a partir dos resultados de testes de laboratório, a interface de teste é cerca de 60 lista de "pit-bit" de itens, modelos de teste para:
iOS: iPhone5 - iOS 9.1
Android: Samsung SM-N9006 - Android 5.0
Weex Lynx dupla onze projetos na prática
O fim móvel do salão principal e da interface de exibição na dinâmica weex dobrar onze projectos, e apoia o envolvimento de. Na nuvem para alcançar uma operadores de redes de distribuição "Zebra" bunda Lynx front-end no desenvolvimento de front-end implementos módulo de interface e lógica de negócios processando o local principal, enquanto no cliente acoplar o telefone Lynx, Taobao telefone.
No ano passado, 2-11 local principal desafio
Em cada 2-11, o principal local é um aspecto muito crítico. Uma grande quantidade de tráfego para o usuário, loja, mercadoria reuniu de vários quadrantes veio aqui como um pouso ponto de partida. Em termos de complexidade do conteúdo, flexibilidade, experiência e por isso temos requisitos muito elevados. Com base em nossa experiência passada, a capacidade de desvio do local de fortalecimento, o local da hierarquia de operações de nivelamento de carga de trabalho justificação, experiência e otimizar o desempenho, é muito importante para alguns detalhes, mas também para deduzir o principal local de três grandes melhorias deste ano objetivos:
Experiência de aplicativo
plana nível
conteúdo personalizado
Experiência de aplicativo para além dos meios tradicionais precisamos ter desempenho HTML5 e experiência; achatada meios de hierarquia que o conteúdo de cada camada será mais rica e complexa, o principal local, é claro, não é excepção, mas obriga-nos a personalizar o conteúdo gerado no conteúdo cedo o algoritmo, entrega, apresenta interface do cliente o conteúdo para carregar e assim por diante todos os aspectos de uma atualização completa.
Weex desempenhar um papel no salão principal
Quer fazer isso, mesmo com boas idéias e pensamentos, ou em virtude da equipe de execução superior, ou por atirar dinheiro para bater a máquina, não há nenhuma maneira de fazer todas as questões a ser a força-driven tecnologia para resolver! Sofisticadas necessidades de design e implementação. equipe weex durante todo o processo de preparação das duas-eleven e demanda partes sobre esses problemas de comunicação em profundidade e de câmbio, e chegar a solução técnica eficaz, uma boa solução para muitos dos aspectos fundamentais dessas questões, e como weex uma nova solução técnica bem resistiu um "teste" tão importante!
Em primeiro lugar, conseguimos um local 2-11 principal para o desenvolvimento do iOS / Android / HTML5 no por weex, recursos de exibição de sincronização multiportas, e para mostrar o efeito de vários aspectos e níveis de experiência são nativas.
Segundo, nós algoritmo com a equipe para atingir as necessidades individuais deste ano 2-11 palco principal, os chamados "mil mil rostos" e para alcançar o principal local 2-11 para as operações de negócios de dados de configuração estáticos e recomendações personalizadas dados dinâmicos algoritmo de partição no final do show. E otimizar todo o conteúdo da carga do cliente, inicializar a interface, o desempenho interativo
Em terceiro lugar, weex manter a flexibilidade para ajustar a liberação do mecanismo perto HTML5 para conseguir uma renderização dinâmica no lado do cliente, o operador pode ajustar a posição do piso do salão principal, e "pit-bit" arranjo através de configuração em tempo real e layout da interface apresentação e estilo ajustes.
Em quarto lugar, com base no desempenho notável no número de apresentação de conteúdo, temos quebrado através do tradicional 120 "posição poço" de limites de desempenho, este 2-11 última adquirido máximo número "pit dígito" perto de 180, desempenho ainda é perfeito - você sabe a equipe está no início para tirar 300 "posição poço" um "teste de limite violenta". Além disso forneceu uma garantia para o local plano.
partilha de boas práticas mais weex e resumo do projeto
Weex e atualmente tem mais partes do negócio para cooperar no Grupo Alibaba, incluindo Taobao Duplo Doze outros projectos (coincide autor com o dia Double Twelve, weex passando por uma nova rodada de hora de escrever culto de batismo!), Nós esperamos acompanhamento haverá mais experiência prática e conhecimento continuar a compartilhá-lo.
equipe weex irá se mover para aproveitar o final da natureza dinâmica desta proposição fundamental em torno de três características weex: o peso leve, de alto desempenho, escaláveis e de melhoria periodicamente iterativo. Vamos praticar uma forma mais simples, uma carga maior / start / prestação / performance interativa, maior personalização para o centro e escalabilidade horizontal continuam a fazer avanços e inovação. E regularmente abrir a versão mais recente e documentação, ferramentas de apoio, a ecologia circundante dentro do grupo.
Sobre Open Source: equipe sempre concordar com um ponto de vista - open source não é um ato simples, mas todo um processo e o resultado final do mesmo. esperanças da equipe weex para gradualmente resolver os problemas de negócios mais gerais, tanto quanto possível para proteger a qualidade da engenharia e código de qualidade, e desenvolver na comunidade pode ser aceite, a participação ea confiança no programa técnico. Refletir o valor maior, ao mesmo tempo, obter mais apoio e desenvolvimento mais rápido. Esta é a nossa esperança, e esperança é que esperamos :)
"Mobile Taobao equipe técnica Zhao Jinjiang (Pitágoras), Golden Bay (Sociedade Iraniana) e outros especialistas envolvidos na criação deste artigo." Este artigo foi publicado na InfoQ.
Sobre Mar Ali
Mar (baichuan.taobao.com) Grupo Ali Alibaba, "nuvem" + "fim" da estratégia central do Alibaba Group, uma plataforma aberta sem fio, baseado em componentes de serviço de classe mundial e de back-end amadurecer negócios, através de "tecnologia dados comercial e aberta grande "para os empresários móveis que podem construir rapidamente App, APP e soluções de comercialização para melhorar a experiência do usuário e, ao mesmo tempo, fornecer uma ampla gama de serviços de negócios - espaço físico, operadores incubadora, capital de risco, etc., para celular empresários para fornecer proteção abrangente.