В любом режиме мы не посылаем ваш код куда либо, все остается на хосте. Даже в режиме Relay, мы устанавливаем end-to-end шифрованную сессию между участниками, что никто (даже) мы не можем читать ваш трафик.
Это хороший фидбек и мы рассматриваем решения для полностью изолированных сессий. Здесь дело не в нежелании, а в количестве фидбека мы получаем для определенных участков продукта и приоритетах. У нас есть старый запрос на оффлайн установку(https://github.com/MicrosoftDocs/live-share/issues/338), но нет на полностью офлайн режим. Можете создать новый запрос на гитхаб или VS Feedback.
Ваш код остается на стороне хоста и никогда никуда не на какие серверы не загружается. За исключением гостей конечно, но даже в этом случае код подгружается частями — грузятся только те части которые гость открывает. Телеметрию собираем да, но у нас так все строго с личными данными пользователя что данные мы собираем не возможно соотнести с каким-то определенным человеком, не говоря уже о его коде.
У меня то же. Mac mini 2,3 GHz Intel Core i7 16 GB 1600 MHz DDR3 Chrome 39.0.2171.95
Решение под катом
Проблема в пейнт шторме вызванном анимацией (зеленные блоки это перерисовка)
Если записать таймлайн — то можно увидеть примерно ту же картину
Уберем шторм:
Не смотря на отдельные композитные слои у svg элементов (оранжевые рамки),
браузер вынужден их перерисовывать так как это вектор, a при любых изменениях (а какие изменения будут при анимации в будущем принято считать неизвестным) он требует растрирования перед выводом на экран. Пейт очень дорогое удовольствие, а растр еще дороже.
Соответственно простое решение — применить анимацию не к svg элементу — а к самой иконке — то есть к диву. Это вынесет сам див на отдельный композитный слой и vo a la! После изменения можете посмотреть таймлайн еще раз — он будет чистым
а пейнт шторм не будет вас больше беспокоить (пейнта нет совсем)
сервер рендерит на PhantomJS и отдает png изображение
проставляете пнг изображения соответствующим иконкам
Плюс этого фалбека состоит в том что сервер рендерит именно тот цвет и размер которые нужны для конкретной иконки.
И можно рендерить заранее, да. Еще при использовании данного фалбека удобно класть svg иконку внутрь дива. <symb.... Часто именно этот див является спасительным мостиком между html и svg разметками.
Ой, прошу прощения. Запутался в техниках :) Нет таких плагинов не встречал. Честно сказать, эксперименты с техникой описанной здесь привели меня к технике с использованием (которую Крис собственно и описал — первый комментарий по вашей ссылке) и вам советую вам переходить на нее :)
Важно понимать что Bootstrap и ему подобные не фреймворки а UI тулкиты. Они были созданы для того чтобы клепать/копипастить быстро и не задумываясь. Если говорить об архитектуре, то ясное дело нужен CSS фрейворк. То что вы предлагаете похоже на фреймворк, советую взглянуть на intuitcss. (хорошие размышления на эту тему)
Я тоже не люблю Bootstrap, в том числе из-за большого количества классов и избыточной верстки, но все-таки
4) Ваше желание избавиться от картинок более-менее понятно, но, как показывает опыт, иногда удобнее добавить на фон картинку в 100байт, чем решать вот это: dl.dropboxusercontent.com/u/68595887/lenta.png (Firefox 20.0)
Если уж в таком простом примере не отказываться от картинок в пользу CSS, то, наверное, этого делать совсем не стоит. У Вас на скриншоте прям очень страшно все, остались эффекты после масштабирования страницы. На самом деле выглядит это так — вокруг треугольника серая рамка.
Происходит это из-за того, что цвет transparent является эквивалентом rgba(0,0,0,0), то есть черным цветом с альфа каналом в нуле, и при рендере вот таких вот треугольников составленных c помощью border-а, FF в паре с операционной системой Windows(из-за особенностей сглаживания), оставляет ляпы черного цвета.
Соответственно решение — задавать цвет не transparent, а rgba(цвет rgb треугольника,0). Никаких хаков или трудных изворотов, просто задавать цвет с учетом FF.
Кстати, по ссылке на генератор CSS треугольников есть совет задавать в таком случае border-style: inset; Я хочу Вас предостеречь, браузер в таком случае будет не только менять цвет треугольника, но и вовсе добавлять не желательные эффекты.
Прошу прощения за то что своим комментарием увеличил концентрацию занудства на этой странице. Просто Вы, как я понял, профессионал, а мне захотелось с кем-нибудь поделиться)
Если записать таймлайн — то можно увидеть примерно ту же картину
Уберем шторм:
Не смотря на отдельные композитные слои у svg элементов (оранжевые рамки),
браузер вынужден их перерисовывать так как это вектор, a при любых изменениях (а какие изменения будут при анимации в будущем принято считать неизвестным) он требует растрирования перед выводом на экран. Пейт очень дорогое удовольствие, а растр еще дороже.
Соответственно простое решение — применить анимацию не к svg элементу — а к самой иконке — то есть к диву. Это вынесет сам див на отдельный композитный слой и vo a la! После изменения можете посмотреть таймлайн еще раз — он будет чистым
а пейнт шторм не будет вас больше беспокоить (пейнта нет совсем)
Есть еще простой фалбек —
Плюс этого фалбека состоит в том что сервер рендерит именно тот цвет и размер которые нужны для конкретной иконки.
И можно рендерить заранее, да. Еще при использовании данного фалбека удобно класть svg иконку внутрь дива. <symb.... Часто именно этот див является спасительным мостиком между html и svg разметками.
Вы не поняли, они обе мои, поэтому я и запутался :)
Я тоже не люблю Bootstrap, в том числе из-за большого количества классов и избыточной верстки, но все-таки
не то же самое, что
так как второй вариант можно считать сухим(DRY), в этом и заключается отличие подхода.
Не советую злоупотреблять дочерними селекторами так как попадете в ловушку «неповоротливой верстки» из-за большой специфичности.
Спасибо за поиск ;D
Если уж в таком простом примере не отказываться от картинок в пользу CSS, то, наверное, этого делать совсем не стоит. У Вас на скриншоте прям очень страшно все, остались эффекты после масштабирования страницы. На самом деле выглядит это так — вокруг треугольника серая рамка.
Происходит это из-за того, что цвет
transparentявляется эквивалентомrgba(0,0,0,0),то есть черным цветом с альфа каналом в нуле, и при рендере вот таких вот треугольников составленных c помощью border-а, FF в паре с операционной системой Windows(из-за особенностей сглаживания), оставляет ляпы черного цвета.Соответственно решение — задавать цвет не transparent, а
rgba(цвет rgb треугольника,0). Никаких хаков или трудных изворотов, просто задавать цвет с учетом FF.Кстати, по ссылке на генератор CSS треугольников есть совет задавать в таком случае border-style: inset; Я хочу Вас предостеречь, браузер в таком случае будет не только менять цвет треугольника, но и вовсе добавлять не желательные эффекты.
Прошу прощения за то что своим комментарием увеличил концентрацию занудства на этой странице. Просто Вы, как я понял, профессионал, а мне захотелось с кем-нибудь поделиться)