Должен ли я использовать Bootstrap из CDN или сделать копию на моем сервере?

Question

Должен ли я использовать Bootstrap из CDN или сделать копию на моем сервере?

какова лучшая практика использования Twitter Bootstrap, обратитесь к нему из CDN или сделайте локальную копию на моем сервере?

поскольку Bootstrap продолжает развиваться, я боюсь, что если я обращусь к CDN, пользователь со временем увидит разные веб-страницы, а некоторые теги могут даже сломаться. Какой выбор у большинства людей?

534 4

twitter-bootstrap twitter-bootstrap-3

4 ответов:

Comments

Ничего не найдено.

KyleMit · Accepted Answer · 2018-03-03 17:31:02

почему не оба \_(ツ)_/? Скотт Хансельман есть хорошая статья об использовании CDN для повышения производительности, но изящно возврат к локальной копии в случае, если CDN не работает.

специфичный для bootstrap, вы можете сделать следующее для загрузка с CDN с локальным резервным:
<head>
  
  <link rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
</head>
<body>
  

  
  <script src="//ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
  
  <script>window.jQuery || document.write('<script src="/local/jquery.min.js"><\/script>')</script>
  
  <script src="//netdna.bootstrapcdn.com/bootstrap/3.0.3/js/bootstrap.min.js"></script>
  
  <script>if(typeof($.fn.modal) === 'undefined') {document.write('<script src="/local/bootstrap.min.js"><\/script>')}</script>
  
  <div id="bootstrapCssTest" class="hidden"></div>
  <script>
    $(function() {
      if ($('#bootstrapCssTest').is(':visible')) {
        $("head").prepend('<link rel="stylesheet" href="/local/bootstrap.min.css">');
      }
    });
  </script>
</body>
* вы также можете сделать тот же тест используя YepNope или запасной вариант.js
* за вспышки комментарий и данное решение, обновленный ответ для проверки .visible класс вместо тестирования rgb(51, 51, 51)
* когда тестирование загруженной таблицы стилей, вы должны искать стиль, который б были применены, создать элемент, и посмотреть, если он был применен.

на ваш вопрос о лучших практик, есть много очень веские причины использовать CDN в производстве окружающая среда:

это увеличивает параллельность доступен.

это увеличивает вероятность того, что будет кэш-нажмите.

это гарантирует, что груз будет меньше.

это уменьшает количество ширина полосы используется на вашем сервере.

это гарантирует, что пользователь получит географически близко ответ.

для вашей проблемы с версиями, любой CDN стоит своего веса в соли, позволяя вам ориентироваться на конкретную версию библиотеки, чтобы вы случайно не вносили критические изменения с каждым выпуском.

Ofiris · Accepted Answer · 2014-10-04 16:01:46

зависит от конкретного сайта.

У вас много пользователей? Вы заботитесь об использовании полосы пропускания? Является ли производительность проблемой (CDN может ускорить ответы) ?

вы можете ссылаться на конкретную версию:

//maxcdn.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css

или

//maxcdn.bootstrapcdn.com/bootstrap/3.2.0/css/bootstrap.min.css

этак вам не нужно беспокоиться об обновлениях библиотеки, его лучше обновлять.

Я не уверен, что точная статистика о выборе разработчиков, но вы можете посмотреть здесь и см. миллиарды запросов отправляются в Bootstrap CDN, что означает, что он надежен и безопасен в использовании.

André Rocha · Accepted Answer · 2018-02-21 18:34:00

Я пытался изменить KyleMit это но форум отмечал как неправильный отступ кода, даже это не было, поэтому я добавляю свой вклад прямо ниже:

поскольку вопрос помечен как twitter-bootstrap темы (и не только twitter-bootstrap-3), возможно, полезно обновить ответ для более новой версии Bootstrap.

поскольку фреймворк добавил новый класс для скрытия элементов в своей четвертой версии, мы должны используйте .d-none вместо .hidden в этом случае.

все остальное остается тем же самым в этом случае, за исключением версии lib (конечно!)

Greg0 · Accepted Answer · 2018-07-20 03:19:24

Добро пожаловать Bootstrap 4.1 CDN:

//stackpath.bootstrapcdn.com/bootstrap/4.1.2/css/bootstrap.min.css