您最多选择25个主题 主题必须以字母或数字开头,可以包含连字符 (-),并且长度不得超过35个字符

151 行
8.8KB

  1. <!DOCTYPE html>
  2. <html>
  3. <meta charset="utf-8">
  4. <head>
  5. <style>
  6. #header
  7. {
  8. background: #2BA6E3;
  9. padding: 0.7em;
  10. text-align: left;
  11. }
  12. #header a
  13. {
  14. color: white;
  15. text-decoration: none;
  16. padding: 0.5em 1em 0.5em 1em;
  17. }
  18. #lang
  19. {
  20. float: right;
  21. }
  22. .news_item
  23. {
  24. background: #FFFFFF;
  25. width: 720px;
  26. padding: 1em;
  27. margin-top: 2em;
  28. margin-bottom: 2em;
  29. border: 1px solid #E0E0E0;
  30. text-align: left;
  31. }
  32. .news_item_contents
  33. {
  34. color: #444;
  35. line-height: 1.5em;
  36. }
  37. .news_item_date
  38. {
  39. margin-bottom: 2em;
  40. color: #aaa;
  41. }
  42. html
  43. {
  44. font-family: sans-serif;
  45. }
  46. body
  47. {
  48. background: #FAFAFA;
  49. }
  50. code, pre
  51. {
  52. font-family: monospace, serif;
  53. font-size: 1em;
  54. color: #7f0a0c;
  55. }
  56. /*
  57. figure
  58. {
  59. margin: 0px;
  60. padding: 0px;
  61. }
  62. */
  63. img
  64. {
  65. width: 720px;
  66. }
  67. .mobile
  68. {
  69. width: 320px;
  70. }
  71. a
  72. {
  73. color: #3A91CB;
  74. }
  75. table
  76. {
  77. border-collapse: collapse;
  78. }
  79. table, th, td
  80. {
  81. border: 1px solid #aaa;
  82. padding: 0.5em;
  83. margin-top: 0.5em;
  84. margin-bottom: 0.5em;
  85. }
  86. </style>
  87. </head>
  88. <body>
  89. <div id="header">
  90. <strong id="title">Open Game Studio</strong>
  91. <a href="../../ru/news/index.html">Новости</a>
  92. <a href="../../ru/game/index.html">Игры</a>
  93. <a href="../../ru/tool/index.html">Инструменты</a>
  94. <a href="../../ru/page/about.html">О нас</a>
  95. <div id="lang">
  96. <a href="../../en/news/example-driven-development.html">EN</a>
  97. <a href="../../ru/news/example-driven-development.html">RU</a>
  98. </div>
  99. </div>
  100. <center>
  101. <h1>В новостях...</h1>
  102. <div class="news_item">
  103. <h2 class="news_item_title">
  104. <a href="example-driven-development.html">Разработка через создание примеров</a>
  105. </h2>
  106. <p class="news_item_date">
  107. 2018-06-27 00:00
  108. </p>
  109. <div class="news_item_contents">
  110. <p><img src="../../images/2018-06-27-example-driven-development.png" alt="Брокер отладки" /></p>
  111. <p>Эта статья описывает то, как создание третьего кросс-платформенного примера OpenSceneGraph привело нас к разработке через создание примеров.</p>
  112. <p><strong>ИЗМЕНЕНИЯ ОТ 2018-08</strong>: третий пример был переименован в четвёртый в связи с причинами, изложенными в <a href="examples-and-dependencies.html">следующей статье</a>.</p>
  113. <p><strong>Третий кросс-платформенный пример OpenSceneGraph</strong></p>
  114. <p>Третий кросс-платформенный пример OpenSceneGraph содержит реализацию <a href="https://github.com/OGStudio/openscenegraph-cross-platform-examples/tree/master/04.RemoteDebugging">удалённой отладки, работающей на всех поддерживаемых платформах</a>. Этот пример относится не столько к OpenSceneGraph, сколько к поддержке различных платформ.</p>
  115. <p>Удалённое взаимодействие ныне предполагает использование HTTP(s) поверх TCP/IP. Таким образом, первая идея реализации подразумевала встраивание сервера HTTP в приложение, чтобы клиенты HTTP могли взаимодействовать с этим сервером.</p>
  116. <p>Однако, раздача HTTP на различных платформах имеет свои сложности:</p>
  117. <ul>
  118. <li>на десктопах есть межсетевые экраны (firewalls)</li>
  119. <li>на мобилках есть ограничения по работе фоновых процессов</li>
  120. <li>веб-браузеры являются клиентами HTTP по дизайну</li>
  121. </ul>
  122. <p>Эти ограничения подтолкнули нас к созданию посредника между отлаживаемым приложением и пользовательским интерфейсом отладки. <a href="https://github.com/OGStudio/debug-broker">Брокер отладки</a>, небольшое приложение Node.js, стало тем самым посредником. Брокер отладки не имеет внешних зависимостей, поэтому его легко использовать практически везде. Благодаря тому, что брокер отладки - это серверное приложение, его достаточно настроить лишь раз и использовать для любого количества приложений.</p>
  123. <p>И <a href="https://github.com/OGStudio/debug-ui">пользовательский интерфейс отладки</a>, и <a href="https://github.com/OGStudio/debug-broker">брокер отладки</a> используют JavaScript, т.к. мы хотели сделать эти инструменты максимально доступными без предварительной установки. Данное решение привело нас к реализации инструментов именно для веб-браузеров. Десктопное приложение потребовало бы дополнительных усилий на установку и поддержку, что лишь усложнило бы работу с инструментами.</p>
  124. <p><strong>Разработка через создание примеров</strong></p>
  125. <p>После создания третьего примера мы осознали важность и достоинства разработки новых функций вне основного проекта:</p>
  126. <ul>
  127. <li>освобождение основного проекта от шума изменений (commit noise)</li>
  128. <li>публичное освещение новой функции приглашает всех к её изучению, критике и улучшению</li>
  129. </ul>
  130. <p>Когда мы делимся нашими знаниями:</p>
  131. <ul>
  132. <li>мы обязаны создавать документацию, объясняющую происходящее (в том числе для нас самих позже)</li>
  133. <li>мы обязаны сторониться непродуманных решений, т.к. они повредят нашей репутации</li>
  134. </ul>
  135. <p>С этого момента все новые функции вроде обработки ввода, загрузки раскладок Маджонга, кэширования ресурсов и т.п. мы будем сначала реализовывать в виде примеров. Мы называем этот подход разработкой через создание примеров.</p>
  136. <p>На этом мы заканчиваем описание того, как создание третьего кросс-платформенного примера OpenSceneGraph привело нас к разработке через создание примеров.</p>
  137. </div>
  138. </div>
  139. <div id="footer">
  140. Сайт сгенерирован <a href="http://opengamestudio.org/pskov/ru">ПСКОВОМ</a>
  141. из <a href="http://github.com/ogstudio/site-opengamestudio">этого исходного кода</a>.
  142. Сайт размещён на <a href="https://pages.github.com">GitHub Pages</a>.
  143. </div>
  144. </center>
  145. </body>
  146. </html>