Скрытые divs для загрузки «ленивого javascript»? Возможная безопасность/другие проблемы?

Question

Мне любопытно мнение людей и мысли об этой ситуации. Причина, по которой я хотел бы ленить загрузку javascript, - это производительность. Загрузка javascript в конце тела уменьшает блокировку браузера и заканчивается гораздо более быстрой загрузкой страниц.

Но есть какая-то автоматизация, которую я использую для генерации html (специально для django). Эта автоматизация позволяет создавать формы с помощью «Виджеты», которые выводят содержимое, необходимое для визуализации всего виджета (дополнительный javascript, css, ...). Проблема в том, что виджет хочет вывести javascript сразу в середину документа, но я хочу, чтобы все javascript загружались в конце тела.

Когда следующий виджет добавляется в форму, вы можете видеть, что делает некоторые <script>...</script> теги:

class AutoCompleteTagInput(forms.TextInput): 
    class Media:              
     css = { 
      'all': ('css/jquery.autocomplete.css',) 
     }            
     js = (
      'js/jquery.bgiframe.js', 
      'js/jquery.ajaxQueue.js',        
      'js/jquery.autocomplete.js', 
     )  

    def render(self, name, value, attrs=None):   
     output = super(AutoCompleteTagInput, self).render(name, value, attrs) 
     page_tags = Tag.objects.usage_for_model(DataSet) 
     tag_list = simplejson.dumps([tag.name for tag in page_tags], 
            ensure_ascii=False) 
     return mark_safe(u'''<script type="text/javascript">     
      jQuery("#id_%s").autocomplete(%s, { 
       width: 150,           
       max: 10, 
       highlight: false, 
       scroll: true, 
       scrollHeight: 100, 
       matchContains: true, 
       autoFill: true    
     });        
     </script>''' % (name, tag_list,)) + output 

То, что я предлагаю, что если кто-то использует <div class=".lazy-js">...</div> с некоторыми CSS (.lazy-js { display: none; }) и некоторые Javascript (jQuery('.lazy-js').each(function(index) { eval(jQuery(this).text()); }), вы можете эффективно заставить всех Javascript для загрузки в конце загрузки страницы:

class AutoCompleteTagInput(forms.TextInput): 
    class Media:              
     css = { 
      'all': ('css/jquery.autocomplete.css',) 
     }            
     js = (
      'js/jquery.bgiframe.js', 
      'js/jquery.ajaxQueue.js',        
      'js/jquery.autocomplete.js', 
     )  

    def render(self, name, value, attrs=None):   
     output = super(AutoCompleteTagInput, self).render(name, value, attrs) 
     page_tags = Tag.objects.usage_for_model(DataSet) 
     tag_list = simplejson.dumps([tag.name for tag in page_tags], 
            ensure_ascii=False) 
     return mark_safe(u'''<div class="lazy-js">     
      jQuery("#id_%s").autocomplete(%s, { 
       width: 150,           
       max: 10, 
       highlight: false, 
       scroll: true, 
       scrollHeight: 100, 
       matchContains: true, 
       autoFill: true    
     });        
     </div>''' % (name, tag_list,)) + output 

Nevermind все детали моей конкретной реализации (конкретные средства массовой информации участвуют), я m ищет консенсус относительно того, может ли метод использования ленивого загруженного javascript через скрытые скрытые теги создавать проблемы, связанные с безопасностью или другими?

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

UPDATE: Я не уверен, что если Джанго имеет возможность стоять в очереди вещи (через фантазии наследования шаблонов или что-то?), Который будет выводиться как раз перед концом </body>?

Answer 1

Я предпочел бы инструмент, который позволяет мне «добавить» содержимое в выходной поток (или) добавить его в буфер, который будет выводиться в конце страницы, непосредственно перед тегом </body>.

Я не уверен, какие коммерческие инструменты поддерживают это (или django?), Но именно так я создал свои фреймворки.

Что касается вашего вопроса о безопасности/других проблемах ... сценарий будет обрабатываться всякий раз, когда он будет прочитан (если вы не выведете тег сценария с атрибутом defer (в IE/более новых браузерах)), так что если он не физически перемещен, это не изменяет поведение или делает его «ленивым».

Надежность, вытаскивание содержимого из тега сценария и вызов eval() на нем открывает вам возможность чего-то исполняющего, что вы не планировали. (маловероятно, но возможно)

Answer 2

The problem is that the widget wants to output javascript immediately into the middle of the document, but I want to ensure all javascript loads at the end of the body.

Тогда я бы не использовать этот виджет. Динамически поставляемый клиентский сценарий со стороны клиента - это катастрофа, которая нарушит безопасность, если вы или ваш пользователь не будете более мудрыми. Как вы узнали, если бы этот код был взломан, например?