Javascript холст HTML5 вопросы производительности

Question

Так что я возился с созданием старой школьной игры для развлечения, используя холст.Firefox работает медленно, но в Chrome нет Firebug, что я считаю почти обязательным требованием при разработке с использованием JavaScript.Итак, первый вопрос: как люди разрабатывают эти сложные игры без помощи firebug?

Второй вопрос.Какие советы по повышению производительности могут помочь функциям рисования (или просто JavaScript в целом) выполняться быстрее?Мне кажется, что именно эта область является узким местом (по крайней мере, для Firefox).

Последний вопрос.После экспериментов с профилированием в firebug я вижу прирост производительности за счет того, что некоторые называют «плохой практикой», например: я организовал код в список функций, каждая из которых выполняет одно действие.Это работает медленнее, чем если бы я просто выкидывал весь код между beginPath () и closePath (), но, делая это таким образом, приводит к спагетти-коду и трудно следоватьКак вы управляете балансом?

Answer 1

Я использую 100% Chrome для разработки, а затем тестирую другие браузеры.

В Chrome есть встроенный инспектор, который (на мой взгляд) лучше Firebug.Гораздо проще проверять стопку, пошагово и проверять объекты.

Щелкните правой кнопкой мыши страницу и выберите «Проверить элемент».(или нажмите CTRL SHIFT + I)

Затем перейдите на вкладку «Сценарии».Справа вы увидите стек вызовов, переменные области видимости, точки останова, стек вызовов и т. Д.Наведя курсор на переменные, вы не только видите их значение, но и исследуете их вложенные значения.

Answer 2

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