Этот сайт существует на доходы от рекламы.
Пожалуйста, выключите AdBlock.
Вернуться   Форум об интернет-маркетинге > >
Ответ
 
Опции темы
Старый 20.02.2019, 15:54   #41
silicoid
Академик
 
Регистрация: 13.10.2014
Сообщений: 1,346
Репутация: 138351

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

Цитата:
Сообщение от Dram Посмотреть сообщение
Я не вижу плюсов picture
Плюс тут только один. изображение загружается только тогда, когда совпадает media условие
silicoid вне форума   Ответить с цитированием

Реклама
Старый 20.02.2019, 15:54   #42
burunduk
Super Moderator
 
Аватар для burunduk
 
Регистрация: 09.01.2007
Сообщений: 17,763
Репутация: 2308311

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

Цитата:
Сообщение от SeVlad Посмотреть сообщение
..либо жабаскрип, либо бекграунд в css.
есть ещё серверное решение, отдавать контент на основании юзерагента
__________________
По многочисленным просьбам шаблон для сайта оптимизированный для продвижения
правильный конструктор сайтов
burunduk вне форума   Ответить с цитированием
Сказали спасибо 2 пользователей:
Старый 20.02.2019, 15:58   #43
SeVlad
Guru-Editor
 
Регистрация: 03.11.2008
Адрес: Donbass
Сообщений: 17,211
Репутация: 1422441

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

Цитата:
Сообщение от burunduk Посмотреть сообщение
есть ещё серверное решение, отдавать контент на основании юзерагента
То было на "Я не вижу плюсов picture". А так-то конечно есть и др решения
__________________
Топики помощи с ⓌordPress и основы безопасности сайтов.
*** Помощь\консультации в топиках форума - БЕСПЛАТНО. Через личку - с бюджетом от 50$ ***
SeVlad вне форума   Ответить с цитированием
Старый 20.02.2019, 16:18   #44
silicoid
Академик
 
Регистрация: 13.10.2014
Сообщений: 1,346
Репутация: 138351

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

Если вы хотите, "вот хотьубей", делать через img
тогда делайте по принципу google pagespeed

шаг номер раз.
определяем тип устройства. (за вас это может сделать deviceJS https://github.com/matthewhudson/current-device )
далее, при помощи js или какой-либо библиотеки, вроде jQuery обегаете все img и смотрите соответствие картинок.

Код:
       	<div class="container"> 
       		<img class="modificated" src="/assets/images/null.gif" alt="hello world" data-desktop="/assets/images/logo.png" data-mobile="/assets/images/logo-mobile.png"  /> 
       	</div>
       
       	<script type="text/javascript">
	   		
			$(document).ready(function(){
				
				var type = 'desktop';
				
				if ( $('html').hasClass('mobile') ){
					type = 'mobile';
				}
				
				$('img.modificated').each(function(i,e){
					console.log(i,e);
					var image = $(e).data(type);
					if (image !== undefined)
					{
						$(e).attr( 'src', image );
					}
				})
			})
			
       	</script>
только имейте ввиду, это действие будет одноразовым
null.gif объемом 43 байта кэшируется при первом обращении, поэтому его влиянием на производительность обычно пренебрегают
silicoid вне форума   Ответить с цитированием
Старый 20.02.2019, 16:20   #45
Dram
Академик
 
Регистрация: 28.06.2008
Сообщений: 6,634
Репутация: 388955

ТопикСтартер Re: Самый простой способ НЕ грузить картинку в display none?

Цитата:
Сообщение от silicoid Посмотреть сообщение
Если вы хотите, "вот хотьубей", делать через img
Мне фиолетово как оно будет сделано - главное чтобы не было лишнего запроса в мобильной версии, поддерживалось всеми современными браузерами и решение было бы на мало строк кода.
Лучшего решения чем data:image/png;base64 пока не предложили.
Dram вне форума   Ответить с цитированием
Старый 20.02.2019, 16:30   #46
silicoid
Академик
 
Регистрация: 13.10.2014
Сообщений: 1,346
Репутация: 138351

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

Dram, Ну ок, ищите и да найдёте.
На этом наши полномочия всё
silicoid вне форума   Ответить с цитированием
Сказали спасибо:
Старый 20.02.2019, 16:34   #47
SeVlad
Guru-Editor
 
Регистрация: 03.11.2008
Адрес: Donbass
Сообщений: 17,211
Репутация: 1422441

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

Цитата:
Сообщение от Dram Посмотреть сообщение
Лучшего решения чем data:image/png;base64 пока не предложили.
Т.е. что говорили что нет - как об стенку горохом..
И чем оно лучше-то? Приносить в жертву объёмы и затем скрывать их, "абы не было запроса" (который тоже можно избежать). Нда уж.. ну кому и кобыла невеста.
SeVlad вне форума   Ответить с цитированием
Старый 20.02.2019, 16:50   #48
silicoid
Академик
 
Регистрация: 13.10.2014
Сообщений: 1,346
Репутация: 138351

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

SeVlad, Я вообще слабо понимаю, зачем пытаться выпилить инициацию одного лишнего потока, если любой сайт, это десятки, если не сотни одновременно открытых потоков.

Мало того, Любой современный браузер способен качать медиаданные в 8-32 потока, независимо от того, мобильный он или десктопный.

Если заниматься оптимизацией, то лучше повыпиливать все @import из цсс, которые в принципе не могут быть многопоточными, что в разы затормаживает загрузку стилей, или, например решить проблему со скриптами, которые должны быть defer/async, иначе они тоже обладают таким приколом, как последовательная загрузка.

А заморачиваться из-за 43 байт, когда всё остальное по метру, а то и более... ну я не знаю.
Ну вот я и говорю, наши полномочия тут всё.
silicoid вне форума   Ответить с цитированием
Старый 20.02.2019, 16:58   #49
Dram
Академик
 
Регистрация: 28.06.2008
Сообщений: 6,634
Репутация: 388955

ТопикСтартер Re: Самый простой способ НЕ грузить картинку в display none?

У меня нет импорт в ксс, да и вообще он один, сжат бротли и отдается пушем. Js отдается тоже пушем, асинхронно тоже сжат и тоже один. И вот попался мне на глаза это логотип и решил я упоротся, не судите строго ))
Dram вне форума   Ответить с цитированием
Сказали спасибо:
Старый 20.02.2019, 17:02   #50
SeVlad
Guru-Editor
 
Регистрация: 03.11.2008
Адрес: Donbass
Сообщений: 17,211
Репутация: 1422441

По умолчанию Re: Самый простой способ НЕ грузить картинку в display none?

Цитата:
Сообщение от silicoid Посмотреть сообщение
зачем пытаться выпилить инициацию одного лишнего потока, если любой сайт, это десятки, если не сотни одновременно открытых потоков.
Перфекционизм напр.

Хотя в данном случае один лишний запрос роли и не сыграет, но если взглянуть глобальнее, то может быть всё гораздо интереснее. И речь не только о мобильный/десктоп, а вообще о разных возможных устройствах
Тема, как оказалось, не так легко решаема. Я-то, откровенно говоря был уверен, что в html5 такое появилось - просто не было задач и потому не вникал. Ведь те же версии для печати без картинок или для озвучки - там же не нужно тянуть всё, только текст. Причем может быть и текст разный.
Т.е. по идее (ну как я думал) должен же существовать простой механизм на уровне html (аля того же srcset), ан нет. Жабаскрипты и пр надо задействовать.
SeVlad вне форума   Ответить с цитированием
Сказали спасибо:
Ответ




Опции темы

Ваши права в разделе
Вы не можете создавать новые темы
Вы не можете отвечать в темах
Вы не можете прикреплять вложения
Вы не можете редактировать свои сообщения

BB коды Вкл.
Смайлы Вкл.
[IMG] код Вкл.
HTML код Выкл.

Быстрый переход



Текущее время: 22:13. Часовой пояс GMT +3.

Регистрация Справка Календарь Поддержка Все разделы прочитаны