.hide(). Show() в одном событии вызывает реиндеринг?

Question

Блиц вопрос. Будет ли что-нибудь делать, если я позвоню element.hide(); ....something...... element.show(); в одном click мероприятии? Я имею в виду, нежелательные мерцания, тяжелые расчеты и т. Д.? Зачем мне это нужно? Потому что в моем коде довольно элегантно, чтобы скрыть все и решить, что показывать тогда.

UPDATE:

Хорошо, ребята, я вчера смотрел в JQuery источники себя и обнаружил, что (как сказал @Msencenb) скрыть/показать только обертка для display:none.

Так я обновляю мой вопрос: будет браузер сделать некоторые непосредственные отрисовки и перерасчеты по display:none, а затем сразу же отрисовке и перерасчеты по display:block в одном .click(function() { ... })? Или он обнаруживает, что после click ничего не изменилось и ничего не делать?

Answer 1

Событие .hide() - это всего лишь обертка вокруг добавления свойства 'display': 'none' css. С точки зрения производительности это означает, что браузеру просто нужно будет перерисовать этот контент, когда он снова станет видимым, что будет сильно зависеть от того, что вы на самом деле делаете. Chrome dev tools has some really cool stuff for profiling.

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

$(function() { 
    $(".toggle").click(function() { 
     $(".hideme").hide(function() { 
     $(".hideme").show(); 
     }); 
    }); 
}); 

Here's a simple example using hide/show

Answer 2

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

Редактировать: Вы можете ознакомиться с this question.