{"blocks":[{"type":"paragraph","data":{"text":"На этой неделе Mozilla представила новый отладчик для JavaScript. Наша редакция постаралась разобраться, чем он отличается от старого, и почему это здорово."}},{"type":"header4","data":{"level":4,"text":"Новые технологии и простота изменений"}},{"type":"paragraph","data":{"text":"Одна из причин выпуска нового дебаггера — сложности с выпуском обновлений для старого. Причиной этому является использование в нём XML User Interface Language (XUL), который в итоге сделал добавление даже малозначительных изменений непростым делом. В новой версии было решено использовать более современную архитектуру, основанную на компонентах React и state-контейнере Redux. В итоге новый отладчик разбит на множество модулей, которые легко поддерживать, дорабатывать и тестировать."}},{"type":"header4","data":{"level":4,"text":"Возможность использования без Firefox"}},{"type":"paragraph","data":{"text":"Mozilla планирует, в первую очередь, использовать дебаггер в браузере Firefox (и отладчик уже включён в ночные сборки). Однако использование новых технологий, которые поддерживаются везде (в отличии от XUL, который был разработан Mozilla и фактически только ими и поддерживался), позволило добавить в отладчик поддержку работы с Chrome и даже Node.js (сейчас это является экспериментальной возможностью)."}},{"type":"header4","data":{"level":4,"text":"Удобный интерфейс"}},{"type":"image","data":{"file":{"id":21582,"url":"https://media.tproger.ru/uploads/2016/09/debuggerhtml-interface-1024x649.png"},"alt":"","title":"","caption":"","stretched":false,"withBackground":false,"withBorder":false,"width":1024,"height":649,"optimizedFile":{"original":"https://media.tproger.ru/uploads/2016/09/debuggerhtml-interface-1024x649.png","alt":"Mozilla представила новый отладчик для JavaScript, доступный для использования в Chrome и Node.js 1","dimensions":{"width":1024,"height":649},"additionalSizes":{"srcSet":[{"url":"https://tproger.ru/signed_image/F90krtaRdrF4hQ3bRuHy7StT1mM_7Pp0J0Zs9jmLJMA/rs:fill:766:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":766},{"url":"https://tproger.ru/signed_image/U5t5Ukg3jVxm07-ppqYv6kg_KTviXOT26An49RpLN2w/rs:fill:1532:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":1532},{"url":"https://tproger.ru/signed_image/H0rMDAop0R1w5s8s09_tnY_JDgLsDyHc719kDC4z0u4/rs:fill:686:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":686},{"url":"https://tproger.ru/signed_image/xwbTLAg0tt3G7lMHA1BVo32AtnE0ELCuvL_0Q9UAdfo/rs:fill:1372:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":1372},{"url":"https://tproger.ru/signed_image/sL-cDwJUzghedxGckVii3mW2yGUJco0b4e93gv69oCk/rs:fill:636:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":636},{"url":"https://tproger.ru/signed_image/HJ4eJsdHMmqKmwtrQGIlEcJcQQ_QE3vcLViwuvf09lw/rs:fill:1272:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":1272},{"url":"https://tproger.ru/signed_image/8ekjxz03LYXJceD6AjsoZm-4aEMMOcV1ILO-G0u1K4c/rs:fill:466:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":466},{"url":"https://tproger.ru/signed_image/IlOCMCrDZBMMgbYoZhgTPAWMNRIve0Om19_4unZ3IkI/rs:fill:932:0:true/cb:vimg_2/f:webp/aHR0cHM6Ly9tZWRpYS50cHJvZ2VyLnJ1L3VwbG9hZHMvMjAxNi8wOS9kZWJ1Z2dlcmh0bWwtaW50ZXJmYWNlLTEwMjR4NjQ5LnBuZw=","dpr":1,"width":932}],"sizes":[{"media":"(min-width: 1441px)","size":"766px"},{"media":"(min-width: 1281px)","size":"686px"},{"media":"(min-width: 1281px)","size":"766px"},{"media":"(min-width: 961px)","size":"766px"},{"media":"(min-width: 671px)","size":"636px"},{"media":"(min-width: 500px)","size":"466px"}]}}}},{"type":"paragraph","data":{"text":"Интерфейс отладчика разделён на три основные части: панель с деревом проекта, панель редактора и вертикальное меню справа. Дерево проекта отображает все части проекта, которые отлаживаются в настоящий момент. Панель редактора отображает код, который рассматривается в настоящий момент, и позволяет устанавливать точки остановки (breakpoints). Меню справа позволяет просматривать точки остановок, которые назначены в настоящий момент, просматривать стек вызовов и список переменных."}},{"type":"header4","data":{"level":4,"text":"Свободное программное обеспечение"}},{"type":"paragraph","data":{"text":"Код отладчика доступен на GitHub и распространяется по свободной лицензии Mozilla Public License v2.0."}},{"type":"separator","data":{"text":"***"}},{"type":"paragraph","data":{"text":"Больше технических деталей вы можете узнать из поста Брайана Кларка (технического менеджера Mozilla) или из документации в репозитории."}}]}

Ошибка в настройках сайта