Использование стилизованной темы на шлеме - хорошая или плохая идея - PullRequest
0 голосов
/ 16 февраля 2019

У меня есть пара тем для сайта.Каждая из этих тем имеет различный набор значков

Параметры программирования

  1. Для каждой темы предусмотрен отдельный компонент Шлем.Фавиконы вставляются как base64 hrefs в компонент шлема
    import favicon from 'assets/favicon.ico';
    import android192 from 'assets/android192.png';
    import android512 from 'assets/android512.png';
    // ... repeat for other icon alternatives

    export const Helmet1 = ({ children }) => (
    <Helmet>
    <link rel="shortcut icon" type="image/x-icon" href={default1} />
    <link sizes="192x192" href={android192} />
    <link sizes="512x512" href={android512} />
    <link rel="apple-touch-icon" href={appleTouch} />
    <link sizes="16x16" href={favicon16} />
    <link sizes="32x32" href={favicon32} />
    <link sizes="150x150" href={mstile150} />
    {children}
    </Helmet>
    );

    // repeat for Helmet 2

    // choose either Helmet1 or Helmet2 in code
Прочитайте значки в теме, затем вставьте их в Шлем
    const MyHelmet = ({ theme, children }) => (
    <Helmet>
    <link rel="shortcut icon" type="image/x-icon" href={theme.default} />
    <link sizes="192x192" href={theme.android192} />
    <link sizes="512x512" href={theme.android512} />
    <link rel="apple-touch-icon" href={theme.appleTouch} />
    <link sizes="16x16" href={theme.icon16} />
    <link sizes="32x32" href={theme.icon32} />
    <link sizes="150x150" href={theme.msTile150} />
    <link rel="mask-icon" href={theme.pinnedTab} />
    {children}
    </Helmet>
    );

    // supply either theme1 or theme2 to this component
??

Вопросы

  1. Есть ли вариант 3 значительно лучше, чем первые два?
  2. Если нет, какой из вариантов 1 и2 Вы бы выбрали?
  3. Облагает ли вариант 2 значительными штрафами за время выполнения из-за необходимости вставлять изображения из значка base64 favicon в шлем вместо выбора между одним подготовленным шлемом или другим?
...