Tufte-css: Adicionar construção ao projeto

Criado em 6 nov. 2017  ·  5Comentários  ·  Fonte: edwardtufte/tufte-css

Uma compilação adicionada poderia criar uma versão reduzida do CSS, chamada tufle.min.css , e também poderia adicionar automaticamente todos os prefixos do fornecedor necessários via Autoprefixer / PostCSS.

Para fazer todo esse trabalho, poderíamos fazer de duas maneiras:

  1. Crie um branch master, que constrói para o branch gh-pages , de preferência com o Travis, de forma que isso aconteça toda vez que o master for atualizado.

  2. Crie uma pasta src que contém o código-fonte e uma pasta de saída chamada dest que contém os artefatos de construção. Em seguida, basta apontar para a versão dest no HTML. Você pode ter que instalar o npm e confirmar os arquivos de construção você mesmo.

Eu recomendaria a versão 1 e seria capaz de configurar a maior parte dela com um PR. Mas precisaríamos de um contribuidor / proprietário para configurar os ramos. Mas esta seria, em minha opinião, a melhor solução. Deixe-me saber o que você prefere.

A questão no nº 119 se beneficiaria muito com isso. E quem quiser usar essa biblioteca também pode usar a versão otimizada.

Comentários muito úteis

Muitos projetos da web agora usam o npm como um gerenciador de pacotes. Seria ótimo se você incluísse um arquivo package.json com uma etapa de compilação e publicasse o pacote no registro npm. Isso permitiria fácil instalação, importação e atualizações.

Todos 5 comentários

Isso também adicionaria a possibilidade de usar um processador como LESS ou SCSS, porém isso pode ser um exagero, visto que o tamanho deste projeto é bem pequeno. Então, eu realmente não recomendaria isso.

A minimização afetaria apenas tufte.css , não os arquivos de fonte, correto?

Meus testes mostram essa economia de ~ 4kb.

Parece certo, no meu teste passamos de 12172 bytes bytes para 7839 bytes . Isso pode não parecer muito, mas tudo conta. Acho que a parte- autoprefixer também ajudaria a minimizá-lo e a mantê-lo.

No momento, você define muitos prefixos de fornecedores não usados, eles são usados ​​apenas por versões muito antigas do Google e do Firefox, visto que eles são atualizados por conta própria, quase nenhum corpo está usando as versões antigas. Isso é apenas um inchaço do arquivo CSS, e o CSS é muito importante para a renderização da página.

As fontes não foram afetadas, woff2 já está compactado. Mas se eles existissem no Google Font ou outro serviço, você poderia ganhar um pouco armazenando-os em cache. Isso também tornaria mais fácil para outras pessoas obterem acesso à fonte, agora elas precisam baixá-la - mas a fonte pode não estar disponível em um CDN (Content Delivery Network).

O talvez maior benefício seria embutir o CSS crítico para o site no html - isso também poderia ser feito com a etapa de construção, mas não ajudaria outras pessoas que estão usando os estilos.

Muitos projetos da web agora usam o npm como um gerenciador de pacotes. Seria ótimo se você incluísse um arquivo package.json com uma etapa de compilação e publicasse o pacote no registro npm. Isso permitiria fácil instalação, importação e atualizações.

@Saturate Acabei de notar esta parte do seu comentário:

No momento, você define muitos prefixos de fornecedores não usados, eles são usados ​​apenas por versões muito antigas do Google e do Firefox, visto que eles são atualizados por conta própria, quase nenhum corpo está usando as versões antigas. Isso é apenas um inchaço do arquivo CSS

Não vejo onde o Tufte CSS faz isso. Executá-lo através do prefixador automático exclui apenas alguns background-size . Você vê mais códigos excluídos em potencial aqui?

Esta página foi útil?
0 / 5 - 0 avaliações

Questões relacionadas

fustkilas picture fustkilas  ·  5Comentários

langford picture langford  ·  21Comentários

gamecubate picture gamecubate  ·  10Comentários

danielnixon picture danielnixon  ·  3Comentários

adamschwartz picture adamschwartz  ·  16Comentários