Альтернатива в iframe

Итак, я осматривался и немного потерялся в этой теме. Люди говорят, что есть альтернативы iframes, но я не вижу ни одного, который подходит для того, что я пытаюсь сделать. Я по существу создал небольшую игру, которая использует видео и воспроизводит конкретные на основе ввода кнопки corret с клавиатуры.

все это находится в отдельном html-файле, и я хочу отобразить его на другом html-файле в состоянии iframe на другой веб-странице. Но я не могу ... чтобы найти лучший подход к этому.

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

есть идеи, с чего начать?

7
html5 iframe javascript

1 ответов

есть одна альтернатива <iframe> и <object> - тег. Он также может отображать контент из разных источников. Pro соответствует стандартам xhtml и рекомендуется использовать, но в старых браузерах нет такой широкой / полезной поддержки (вам нужно возиться с ней, чтобы получить ее прямо в IE). Он используется следующим образом:

<object data="page.html" width="400" height="300" type="text/html">
    Alternative Content
</object>

это прямой ответ на ваш вопрос, я не думаю, что это даст вам какое-либо преимущество в скорости. Уже по той причине, что <iframe> - элемент гораздо больше используется и поэтому более проверен и заботится, чем <object>.

Я для себя никогда не видел <iframe> является причиной замедления, но это все еще может быть возможно. Если это вариант, вы обязательно должны попробовать, что ocanal сказал раньше в комментариях: пусть ваш скрипт работает на контейнере-div обертки вместо элемента body и поэтому вставляет его непосредственно на mainpage.

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

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

    • изменение DOM много - что всегда медленно
    • действуя много на вещах, даже не видимых на экране

    • получение атрибутов из объекты. Для каждого дополнительного периода вы используете это означает больше работы для вашего процессора:

      // instead of using this over and over again
house.roof.window.handle.open();
house.roof.window.handle.close();

// save it to a var and use that instead
var handle = house.roof.window.handle;
handle.open();
handle.close();
  2. обновление игры в короткие равные интервалы по window.setTimeout() также может быть слишком быстрым и тратить мощность процессора без необходимости (или слишком медленно и не будет выглядеть хорошо, но никогда не будет правильно) - так что вы можете использовать новый window.requestAnimationFrame. Варианты с префиксами поставщика реализованы в текущих версиях всех важных браузеров, и их легко обеспечить старый метод.
  3. в качестве последней мысли: возможно, это даже помогает каким-то мета-магическим способом включить сам файл скрипта на главной странице, а не во встроенный документ
11