Node-vibrant: Reduza o tamanho da biblioteca

Criado em 21 jun. 2019 · 9Comentários · Fonte: Vibrant-Colors/node-vibrant

Vejo que esta biblioteca declara jimp como uma dependência para fazer algumas transformações.

Estou analisando as dependências dos meus projetos (tenho node-vibrant no meu package.json e parece que jimp precisa de muitos espaços:

ncdu 1.14 ~ Use the arrow keys to navigate, press ? for help
--- /deploy/out/node_modules ---------------
  185.0 MiB [##########] /<strong i="11">@jimp</strong>
   38.4 MiB [##        ] /chrome-aws-lambda
   34.2 MiB [#         ] /sharp
   11.0 MiB [          ] /<strong i="12">@browserless</strong>
   11.0 MiB [          ] /<strong i="13">@babel</strong>
    9.2 MiB [          ] /jimp
    6.3 MiB [          ] /core-js
    4.8 MiB [          ] /lodash
    3.2 MiB [          ] /jsdom
    3.1 MiB [          ] /moment
    3.0 MiB [          ] /iltorb
    2.4 MiB [          ] /colorable
    2.1 MiB [          ] /cssstats
    1.9 MiB [          ] /<strong i="14">@cliqz</strong>
    1.7 MiB [          ] /<strong i="15">@microlink</strong>
    1.7 MiB [          ] /graphql
    1.7 MiB [          ] /port-numbers
    1.7 MiB [          ] /node-vibrant

O que quero dizer é que jimp inclui algum plug-in por padrão:

--- /deploy/out/node_modules/<strong i="20">@jimp</strong> ---------
                         /..
    7.6 MiB [##########] /plugin-print
    7.0 MiB [######### ] /core
    6.9 MiB [######### ] /plugin-resize
    6.9 MiB [######### ] /plugin-color
    6.8 MiB [########  ] /plugin-crop
    6.8 MiB [########  ] /plugin-blur
    6.8 MiB [########  ] /plugin-rotate
    6.8 MiB [########  ] /png
    6.8 MiB [########  ] /custom
    6.8 MiB [########  ] /plugin-blit
    6.8 MiB [########  ] /plugin-contain
    6.8 MiB [########  ] /plugin-normalize
    6.8 MiB [########  ] /plugins
    6.8 MiB [########  ] /plugin-cover
    6.8 MiB [########  ] /plugin-gaussian
    6.8 MiB [########  ] /plugin-scale
    6.8 MiB [########  ] /bmp
    6.8 MiB [########  ] /plugin-mask
    6.8 MiB [########  ] /plugin-displace
    6.8 MiB [########  ] /jpeg

mas não tenho certeza se todos os plug-ins são relevantes para node-vibrant .

Quero sugerir duas abordagens:

Considere usar `sharp`

(minha solução favorita)

Como você pode ver em meu pacote, também tenho sharp como uma dependência.

A principal diferença entre os dois é jimp é 100% código javascript, enquanto sharp delegar em binários filho.

Na primeira vez, pensei que jimp poderia ser melhor, já que não tem dependências, mas a realidade é tão diferente: sharp envia binários pré-instalados e o tamanho do pacote é realmente muito menor do que jimp .

Na verdade, sharp perf é superior, veja
http://sharp.pixelplumbing.com/en/stable/performance/

Apenas exclua o não necessário `jimp`

Suponho que dentro de 185 MB que jimp está adicionando lá, apenas algumas coisas são realmente usadas.

Não tenho certeza de como fazer isso a partir de node-vibrant , mas por exemplo adicionar uma pequena seção no README.md explicitamente listou os jimp plug-ins necessários deve ser suficiente para qualquer um excluir o resto das coisas não necessárias dentro uma etapa de pré-construção

enhancement

Fonte

Kikobeats

👍1

Comentários muito úteis

Aqui estão algumas pesquisas adicionais sobre como o jimp pode ser configurado para reduzir o tamanho:

O pacote @jimp/custom atua como uma base para adicionar plug-ins do zero. Sua exportação padrão é uma função configure que recebe arrays de types (tipos de imagem suportados) e plugins (plug-ins a serem usados).

@jimp/types exporta todos os tipos incluídos no pacote principal jimp , tornando fácil ter suporte para as mesmas imagens que o nó vibrante suporta agora.

O único plugin especial que o node-vibrant parece usar é a função resize . O plugin correspondente é @jimp/plugin-resize .

O pacote @vibrant/image-node pode ser atualizado com o seguinte próximo ao início do script:

import configure from '@jimp/custom';
import types from '@jimp/types'; // all of jimp's default types
import resize from '@jimp/plugin-resize'; // resize function

const Jimp = configure({
  types: [types],
  plugins: [resize]
});

NotWoods em 28 jul. 2019

🎉1 👍1

Todos 9 comentários

Amei o trabalho que você fez para analisar isso, um sincero obrigado.

É improvável que sharp seja uma solução que possamos adotar, já que (apesar do nome) oferecemos suporte ao navegador para executar node-vibrant por conta própria.

No entanto, você está absolutamente correto que jimp não é necessário para grande parte do uso em node-vibrant . No momento, estamos restringindo o desenvolvimento da base de código "estável" atual, estamos trabalhando em uma reescrita da base de código para um monorepo (o que significa que você também pode escolher o que deseja usar em node-vibrant no futuro !) e eu confirmei que essa é uma otimização de tamanho que podemos fazer lá também.

Tenho uma semana extremamente ocupada pela frente, mas farei o meu melhor para voltar no próximo fim de semana para fazer essa mudança

Caso contrário, sempre amamos e aceitamos solicitações de pull 👀

crutchcorn em 21 jun. 2019

Observei outra coisa por trás de @jimp : eles têm core-js como dependência, e essa dependência é instalada para cada plug-in!

É por isso que os tamanhos de @jimp têm 185 MB: core-js ocupa 7,4 MiB x 27 módulos = ESPAÇO DEMAIS.

Provavelmente core-js podem ser declarados de uma forma que possam ser compartilhados entre os plug-ins

Kikobeats em 22 jun. 2019

Aqui estão algumas pesquisas adicionais sobre como o jimp pode ser configurado para reduzir o tamanho:

@jimp/types exporta todos os tipos incluídos no pacote principal jimp , tornando fácil ter suporte para as mesmas imagens que o nó vibrante suporta agora.

O único plugin especial que o node-vibrant parece usar é a função resize . O plugin correspondente é @jimp/plugin-resize .

O pacote @vibrant/image-node pode ser atualizado com o seguinte próximo ao início do script:

import configure from '@jimp/custom';
import types from '@jimp/types'; // all of jimp's default types
import resize from '@jimp/plugin-resize'; // resize function

const Jimp = configure({
  types: [types],
  plugins: [resize]
});

NotWoods em 28 jul. 2019

🎉1 👍1

Parece que preciso escrever algumas tipificações, mas muito obrigado @NotWoods. Vou tentar terminar esta semana

crutchcorn em 28 jul. 2019

❤1

A digitação está demorando mais do que eu pensava originalmente. Sei que estou indo pelo caminho mais longo, mas quero ter certeza de que estou consertando o ecossistema, bem como nossas próprias necessidades

crutchcorn em 6 ago. 2019

As digitações para o jimp acabaram demorando um pouco, mas é uma boa contribuição upstream:

https://github.com/oliver-moran/jimp/pull/770

Depois que isso for mesclado, farei a otimização para node-vibrant

crutchcorn em 7 ago. 2019

Com o lançamento do Jimp 0.8.4, isso agora pode ser feito! Eu terei um PR aberto hoje à noite com ele! : D

crutchcorn em 20 set. 2019

🎉1

Aguardando https://github.com/oliver-moran/jimp/pull/815 para corrigir alguns problemas após jimp 0.8.4 com a importação

crutchcorn em 16 nov. 2019

Isso foi resolvido a partir do lançamento de 3.1.5

crutchcorn em 27 nov. 2019