rebuilding site Tue, May 21, 2019 5:49:04 PM
Evan Hemsley
parent
fb29a5df05
commit
f1184207dc
|
|
@ -9,16 +9,16 @@
|
|||
<title>404 Page not found</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/horsey.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/horsey.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left {
|
||||
|
|
|
|||
|
|
@ -12,20 +12,20 @@
|
|||
<title>Categories :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558477076"></script>
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
|
|
@ -52,14 +52,14 @@
|
|||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -75,13 +75,13 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why" class="dd-item
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
|
@ -102,17 +102,127 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="" class="dd-item
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
|
@ -286,7 +396,87 @@
|
|||
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/" title="Why" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/" title="Why?" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -296,20 +486,20 @@
|
|||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558477076"></script>
|
||||
<script src="/js/jquery.sticky.js?1558477076"></script>
|
||||
<script src="/js/featherlight.min.js?1558477076"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558477076"></script>
|
||||
<script src="/js/highlight.pack.js?1558477076"></script>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558477076"></script>
|
||||
<script src="/js/learn.js?1558477076"></script>
|
||||
<script src="/js/hugo-learn.js?1558477076"></script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558477076" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558477076"></script>
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -12,20 +12,20 @@
|
|||
<title>Encompass :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558477076"></script>
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
|
|
@ -52,14 +52,14 @@
|
|||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -75,13 +75,13 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why" class="dd-item
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
|
@ -102,17 +102,127 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="" class="dd-item
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
|
@ -251,7 +361,87 @@ A C# implementation is forthcoming.</p>
|
|||
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/" title="Why" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/" title="Why?" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -261,20 +451,20 @@ A C# implementation is forthcoming.</p>
|
|||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558477076"></script>
|
||||
<script src="/js/jquery.sticky.js?1558477076"></script>
|
||||
<script src="/js/featherlight.min.js?1558477076"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558477076"></script>
|
||||
<script src="/js/highlight.pack.js?1558477076"></script>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558477076"></script>
|
||||
<script src="/js/learn.js?1558477076"></script>
|
||||
<script src="/js/hugo-learn.js?1558477076"></script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558477076" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558477076"></script>
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,24 +1,52 @@
|
|||
[
|
||||
{
|
||||
"uri": "http://example.org/why/",
|
||||
"title": "Why",
|
||||
"title": "Why?",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": " Chapter 1 Why? A question that many of us find ourselves asking when coding a game.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/why/architecture/",
|
||||
"title": "",
|
||||
"uri": "http://example.org/why/the_hard_way/",
|
||||
"title": "The Hard Way",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": ""
|
||||
"content": "If you\u0026rsquo;re reading this, you have probably been frustrated by code you wrote.\nMaybe a feature that you thought would take a few hours took a few days. Or a few weeks.\nMaybe a bug you fixed a month ago came back and you can\u0026rsquo;t stand the idea of trying to fix it again.\nMaybe you stare at your screen for hours wondering where a new structure could possibly fit into your program.\nMaybe you find yourself screaming WHY!!!! at your computer and throwing something across the room.\nI\u0026rsquo;m here to tell you that coding a game doesn\u0026rsquo;t have to be this hard.\nJust say it with me. It doesn\u0026rsquo;t have to be this hard. It doesn\u0026rsquo;t!\nThe road to recovery starts with some basic structural ideas and a little bit of discipline.\nCome along with me, won\u0026rsquo;t you? Let\u0026rsquo;s write some good code.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/categories/",
|
||||
"title": "Categories",
|
||||
"uri": "http://example.org/why/architecture/mess/",
|
||||
"title": "The Messy Basement",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": ""
|
||||
"content": "Unexpected behavior jumps out at you constantly. You feel like you\u0026rsquo;re playing whack-a-mole with bugs. You can\u0026rsquo;t remember where you put anything and keeping everything sorted is a constant nightmare.\nUh oh. You\u0026rsquo;re in a messy basement.\nSome characteristics of the messy basement:\n Magic values, aka putting numbers directly in the source code. Game objects directly manipulating each other\u0026rsquo;s values willy-nilly. Multiple objects that keep track of and depend on each other\u0026rsquo;s state. The key characteristic of this structure is that there almost doesn\u0026rsquo;t seem to be any structure at all.\nShockingly, some game engines and frameworks not only fail to prevent this kind of architecture, they actually encourage it!\nI don\u0026rsquo;t need to say much more about this kind of architecture. It\u0026rsquo;s obviously bad. Let\u0026rsquo;s move on.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/why/architecture/oop/",
|
||||
"title": "OOP",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": "They call it OOP because it was a mistake. \u0026ndash;Unknown\nYou are probably very familiar with OOP, or object-oriented programming, as a game designer. It is the structural idea behind most games as they are written today, though this is slowly changing.\nOOP is a structure based on the concept of Objects. Objects contain both data, referred to as properties, and logic, referred to as methods.\nObject orientation is an intuitive idea when it comes to building simulation-oriented applications such as video games. We think of each \u0026ldquo;thing\u0026rdquo; in the game as a self-contained object which can be acted upon externally via methods. For example, in the game Asteroids, we could think of the game this way: the ship is an object, the bullets the ship fires are objects, the asteroids are objects, and so on.\nUnfortunately, things aren\u0026rsquo;t quite this simple when it comes to more complex games.\nAs programmers we want to re-use code as much as possible. Every bit of duplication is an opportunity for bugs to lurk in our program. Object-oriented code accomplishes re-use with a concept called inheritance. With inheritance, classes can be partially based on other classes. Maybe a Ball class has a position and a velocity and a bounciness property. A BouncyBall would inherit from Ball and have a greater value in its bounciness property. Simple enough, right?\nBut we soon run into problems. In game development we often wish to mix-and-match behaviors. Suppose I have an object where it would make sense to inherit from two different classes. Now\u0026hellip; we are hosed! Why? If two parent classes have a property or a method with the same name, now our child object has no idea what to do. Object-oriented systems, in fact, forbid multiple inheritance. So we end up having to share code via helper functions, or giant manager classes, or other awkward patterns.\nWe also run into an issue called tight coupling. Objects that reference each other\u0026rsquo;s properties or methods directly become a problem when we change the structure of those objects in any way. If we modify the structure of object B, and object A references object B, then we have to also modify object A. In a particularly poorly structured system, we might have to modify a dozen objects just to make a slight modification to the behavior of a single object.\nTight coupling is our worst nightmare as game programmers. Games are, by nature, extremely complex simulations. The more coupling we have between objects, the more of the entire environment of the game we have to understand before we can pick apart the specific behavior of a single object, let alone the whole game itself. It is very possible that we can surprise ourselves by unexpectedly changing the behavior of different objects when modifying a single object. And we hate surprises.\nWe want our architecture to encourage us to create as little coupling as possible between different elements of the game, so that we can look at any individual element of the game and easily understand how it behaves without needing to deeply understand the other elements of the game. We also wish to modify behavior without introducing unexpected changes in other seemingly unrelated objects. OOP works in very specific encapsulated cases, but it is not a satisfactory structure for implementing game behavior.\nIt turns out there is an architecture that addresses our desire to be able to compose objects out of several different behaviors. Let\u0026rsquo;s learn about it.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/why/architecture/",
|
||||
"title": "Architecture",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": "Architecture simply means the basic structure of a program, and how things are added to the program. It is the foundation of everything you build.\nAll programs that you write have some kind of architecture, even if you haven\u0026rsquo;t really thought about it much. Let\u0026rsquo;s go over some different architectures and talk about their features.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/why/architecture/ecs/",
|
||||
"title": "ECS",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": "ECS stands for Entity-Component-System. It is based on two fundamental principles:\n There should be complete separation between data and logic. Objects should be created via composition and not inheritance. Components are the most basic element. They are simply containers of related data. In a 2D game we could have a PositionComponent with an x and y value. Components do not contain logic, though they might have callbacks to deal with side effects, for example creating or destroying bodies in a physics simulator.\nEntities are generic objects, which have a unique ID and a collection of Components. Entities have no inherent behavior or properties of their own, but are granted these by Components. We can add, remove, or modify Components of Entities as necessary during the simulation.\nSystems are responsible for reading and modifying Entities and Components. For example, a MotionSystem might look at Entities that have both a PositionComponent and VelocityComponent, and update the PositionComponent based on the information in the VelocityComponent.\nNotice, in our above example, that this gives us a tremendous amount of flexibility. We can completely remove the VelocityComponent from an Entity while the game is running, and the Entity will simply stop moving - nothing else will break, because nothing has to rely on an Entity specifically containing a VelocityComponent! This is the power of composition and de-coupling at work.\nUnfortunately, ECS is not without its problems.\nSuppose we have a game where the player character can move left or right, and also has a special ability that lets them teleport forward over a short distance. We could put all of this logic in the same System, but most Entities that move around are not going to have this behavior, so it makes sense to have a separate system. In other words, we have introduced multiple systems that need to manipulate the position of objects.\nWe could have a TeleportSystem that immediately sets the x and y value of the PositionComponent so it is in front of the player\u0026rsquo;s current position. But if the TeleportSystem runs before our regular Motion System, the Position Component will be overwritten by the regular Motion System and we will not see the teleportation behavior occur, even though the system is running!\nThis kind of bug is known as a race condition. Race conditions are one of the worst kinds of bug to handle, because it is incredibly hard to trace values being over-written by other values. In my experience, race conditions are probably a good 80% of what game programmers deal with. No wonder we are so frustrated all the time!\nIn my opinion, being forced to think about the order in which Systems run is a form of tight coupling, because it means you have to consider the behavior of other systems when writing a new system to avoid introducing bugs.\nThis example also illustrates another problem with ECS: in Systems that have similar behavior, we don\u0026rsquo;t really have a nice structure to share that behavior.\nI have created a variant of ECS that intends to address these and other problems. Let me tell you about it.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/why/architecture/hyper_ecs/",
|
||||
"title": "Hyper ECS",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": "Hyper ECS is a new architecture pattern that attempts to address some common issues with standard ECS.\nThe core of the architecture is the introduction of a new construct to ECS: the Message.\nA Message is fundamentally a variant of Component, in that it only contains data. But, it is designed to be temporary and is discarded at the end of each frame. It is used to communicate useful information between Systems.\nWe also introduce some extra information to Systems. Each System must declare the Messages that it Reads, the Messages that it Emits, and the Components that it Mutates.\nLet\u0026rsquo;s go back to our earlier example.\nWe have TransformComponent, which contains position and orientation data, and VelocityComponent, which contains an x and y component for linear motion.\nOur MotionDetecterSystem reads each Entity that has both a TransformComponent and a VelocityComponent, and emits a MotionMessage, which contains a reference to the specific TransformComponent and the x and y velocity given by the VelocityComponent.\nWe also have a TeleportSystem that needs to teleport the character forward a bit. Let\u0026rsquo;s say when the player presses the X button, a TeleportMessage is fired. The TeleportSystem reads this message and emits a MotionMessage in response.\nNow we have our MotionSystem. The MotionSystem declares that it Mutates the TransformComponent, reads the MotionMessages that apply to each TransformComponent, and applies them simultaneously, adding their x and y values to the TransformComponent. Voilà! No race conditions! And we can re-use similar behaviors easily without re-writing code by consolidating Messages.\nYou might be wondering: how does the game know which order these systems need to be in?\nWith the power of graph theory, we can construct an order for our Systems so that any System which Emits a certain Message runs before any System that Reads the same Message. This means, when you write behavior for your game, you never have to specify the order in which your Systems run. You simply write code, and the Systems run in a valid order, every time, without surprising you.\nOf course, to accomplish this, there are some restrictions that your Systems must follow.\nSystems are not allowed to create message cycles: if System A emits Message B, which is read by System B which emits Message C, which is read by System A, then we cannot create a valid ordering of Systems. This is not a flaw in the architecture: A message cycle is simply evidence that you haven\u0026rsquo;t quite thought through what your Systems are doing, and can generally be easily eliminated by the introduction of a new System.\nTwo separate systems are not allowed to Mutate the same Component. Obviously, if we allowed this, we would introduce the possibility of two Systems changing the same component, creating a race condition. If we have two Systems where it makes sense to change the same Component, we can create a new Message and System to consolidate the changes, and avoid race conditions.\nIf you are used to programming games in an object-oriented way, you will likely find the ECS pattern counter-intuitive at first. But once you learn to think in a Hyper ECS way, you will be shocked at how flexible and simple your programs become.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/",
|
||||
|
|
@ -27,6 +55,13 @@
|
|||
"description": "",
|
||||
"content": " Encompass encompass is a powerful engine-agnostic framework to help you code games, or other kinds of simulations.\nObject-oriented code is messy and rapidly becomes unmaintainable.\nencompass lets you write clean, de-coupled code so you can spend more time on your game design and less time fixing bugs.\nencompass is currently available with a TypeScript implementation that fully supports transpilation to Javascript and Lua. A C# implementation is forthcoming.\n"
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/categories/",
|
||||
"title": "Categories",
|
||||
"tags": [],
|
||||
"description": "",
|
||||
"content": ""
|
||||
},
|
||||
{
|
||||
"uri": "http://example.org/tags/",
|
||||
"title": "Tags",
|
||||
|
|
|
|||
|
|
@ -6,9 +6,55 @@
|
|||
<description>Recent content in Encompass on Encompass Docs</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Tue, 21 May 2019 15:56:13 -0700</lastBuildDate>
|
||||
|
||||
<atom:link href="http://example.org/index.xml" rel="self" type="application/rss+xml" />
|
||||
|
||||
|
||||
<item>
|
||||
<title>The Messy Basement</title>
|
||||
<link>http://example.org/why/architecture/mess/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:48:10 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/mess/</guid>
|
||||
<description>Unexpected behavior jumps out at you constantly. You feel like you&rsquo;re playing whack-a-mole with bugs. You can&rsquo;t remember where you put anything and keeping everything sorted is a constant nightmare.
|
||||
Uh oh. You&rsquo;re in a messy basement.
|
||||
Some characteristics of the messy basement:
|
||||
Magic values, aka putting numbers directly in the source code. Game objects directly manipulating each other&rsquo;s values willy-nilly. Multiple objects that keep track of and depend on each other&rsquo;s state.</description>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>OOP</title>
|
||||
<link>http://example.org/why/architecture/oop/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:54:18 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/oop/</guid>
|
||||
<description>They call it OOP because it was a mistake. &ndash;Unknown
|
||||
You are probably very familiar with OOP, or object-oriented programming, as a game designer. It is the structural idea behind most games as they are written today, though this is slowly changing.
|
||||
OOP is a structure based on the concept of Objects. Objects contain both data, referred to as properties, and logic, referred to as methods.
|
||||
Object orientation is an intuitive idea when it comes to building simulation-oriented applications such as video games.</description>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>ECS</title>
|
||||
<link>http://example.org/why/architecture/ecs/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:55:45 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/ecs/</guid>
|
||||
<description>ECS stands for Entity-Component-System. It is based on two fundamental principles:
|
||||
There should be complete separation between data and logic. Objects should be created via composition and not inheritance. Components are the most basic element. They are simply containers of related data. In a 2D game we could have a PositionComponent with an x and y value. Components do not contain logic, though they might have callbacks to deal with side effects, for example creating or destroying bodies in a physics simulator.</description>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>Hyper ECS</title>
|
||||
<link>http://example.org/why/architecture/hyper_ecs/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:56:13 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/hyper_ecs/</guid>
|
||||
<description>Hyper ECS is a new architecture pattern that attempts to address some common issues with standard ECS.
|
||||
The core of the architecture is the introduction of a new construct to ECS: the Message.
|
||||
A Message is fundamentally a variant of Component, in that it only contains data. But, it is designed to be temporary and is discarded at the end of each frame. It is used to communicate useful information between Systems.</description>
|
||||
</item>
|
||||
|
||||
</channel>
|
||||
</rss>
|
||||
|
|
@ -7,9 +7,39 @@
|
|||
<lastmod>2019-05-21T14:25:56-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/why/the_hard_way/</loc>
|
||||
<lastmod>2019-05-21T15:20:55-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/why/architecture/mess/</loc>
|
||||
<lastmod>2019-05-21T15:48:10-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/why/architecture/oop/</loc>
|
||||
<lastmod>2019-05-21T15:54:18-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/why/architecture/</loc>
|
||||
<priority>0</priority>
|
||||
<lastmod>2019-05-21T15:18:37-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/why/architecture/ecs/</loc>
|
||||
<lastmod>2019-05-21T15:55:45-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/why/architecture/hyper_ecs/</loc>
|
||||
<lastmod>2019-05-21T15:56:13-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/</loc>
|
||||
<lastmod>2019-05-21T15:56:13-07:00</lastmod>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
|
|
@ -17,10 +47,6 @@
|
|||
<priority>0</priority>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/</loc>
|
||||
</url>
|
||||
|
||||
<url>
|
||||
<loc>http://example.org/tags/</loc>
|
||||
<priority>0</priority>
|
||||
|
|
|
|||
|
|
@ -12,20 +12,20 @@
|
|||
<title>Tags :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558477076"></script>
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
|
|
@ -52,14 +52,14 @@
|
|||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -75,13 +75,13 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why" class="dd-item
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
|
@ -102,17 +102,127 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="" class="dd-item
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
|
@ -286,7 +396,87 @@
|
|||
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/" title="Why" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/" title="Why?" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -296,20 +486,20 @@
|
|||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558477076"></script>
|
||||
<script src="/js/jquery.sticky.js?1558477076"></script>
|
||||
<script src="/js/featherlight.min.js?1558477076"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558477076"></script>
|
||||
<script src="/js/highlight.pack.js?1558477076"></script>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558477076"></script>
|
||||
<script src="/js/learn.js?1558477076"></script>
|
||||
<script src="/js/hugo-learn.js?1558477076"></script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558477076" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558477076"></script>
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,562 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" class="js csstransforms3d">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="Hugo 0.55.6" />
|
||||
<meta name="description" content="">
|
||||
|
||||
|
||||
<link rel="icon" href="/images/favicon.png" type="image/png">
|
||||
|
||||
<title>ECS :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
display:none !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body class="" data-url="/why/architecture/ecs/">
|
||||
<nav id="sidebar" class="">
|
||||
|
||||
|
||||
|
||||
<div id="header-wrapper">
|
||||
<div id="header">
|
||||
<img src="/images/logo.png" width="100" height="100">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="searchbox">
|
||||
<label for="search-by"><i class="fas fa-search"></i></label>
|
||||
<input data-search-input id="search-by" type="search" placeholder="Search...">
|
||||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="highlightable">
|
||||
<ul class="topics">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item active">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="footer">
|
||||
<p>Built with <a href="https://github.com/matcornic/hugo-theme-learn"><i class="fas fa-heart"></i></a> from <a href="http://getgrav.org">Grav</a> and <a href="http://gohugo.io/">Hugo</a></p>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="body">
|
||||
<div id="overlay"></div>
|
||||
<div class="padding highlightable">
|
||||
|
||||
<div>
|
||||
<div id="top-bar">
|
||||
|
||||
|
||||
<div id="breadcrumbs" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">
|
||||
<span id="sidebar-toggle-span">
|
||||
<a href="#" id="sidebar-toggle" data-sidebar-toggle="">
|
||||
<i class="fas fa-bars"></i>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span id="toc-menu"><i class="fas fa-list-alt"></i></span>
|
||||
|
||||
<span class="links">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a href='/'>Encompass</a> > <a href='/why/'>Why?</a> > <a href='/why/architecture/'>Architecture</a> > ECS
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="progress">
|
||||
<div class="wrapper">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="head-tags">
|
||||
|
||||
</div>
|
||||
|
||||
<div id="body-inner">
|
||||
|
||||
<h1>
|
||||
|
||||
ECS
|
||||
</h1>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>ECS stands for <strong>Entity-Component-System</strong>. It is based on two fundamental principles:</p>
|
||||
|
||||
<ul>
|
||||
<li>There should be complete separation between data and logic.</li>
|
||||
<li>Objects should be created via <em>composition</em> and not inheritance.</li>
|
||||
</ul>
|
||||
|
||||
<p><strong>Components</strong> are the most basic element. They are simply containers of related data. In a 2D game we could have a PositionComponent with an <em>x</em> and <em>y</em> value. Components do not contain logic, though they might have callbacks to deal with side effects, for example creating or destroying bodies in a physics simulator.</p>
|
||||
|
||||
<p><strong>Entities</strong> are generic objects, which have a unique ID and a collection of Components. Entities have no inherent behavior or properties of their own, but are granted these by Components. We can add, remove, or modify Components of Entities as necessary during the simulation.</p>
|
||||
|
||||
<p><strong>Systems</strong> are responsible for reading and modifying Entities and Components. For example, a MotionSystem might look at Entities that have both a PositionComponent and VelocityComponent, and update the PositionComponent based on the information in the VelocityComponent.</p>
|
||||
|
||||
<p>Notice, in our above example, that this gives us a tremendous amount of flexibility. We can completely remove the VelocityComponent from an Entity while the game is running, and the Entity will simply stop moving - nothing else will break, because nothing has to rely on an Entity specifically containing a VelocityComponent! This is the power of composition and de-coupling at work.</p>
|
||||
|
||||
<p>Unfortunately, ECS is not without its problems.</p>
|
||||
|
||||
<p>Suppose we have a game where the player character can move left or right, and also has a special ability that lets them teleport forward over a short distance. We could put all of this logic in the same System, but most Entities that move around are not going to have this behavior, so it makes sense to have a separate system. In other words, we have introduced multiple systems that need to manipulate the position of objects.</p>
|
||||
|
||||
<p>We could have a TeleportSystem that immediately sets the <em>x</em> and <em>y</em> value of the PositionComponent so it is in front of the player’s current position. But if the TeleportSystem runs before our regular Motion System, the Position Component will be overwritten by the regular Motion System and we will not see the teleportation behavior occur, even though the system is running!</p>
|
||||
|
||||
<p>This kind of bug is known as a <em>race condition</em>. Race conditions are one of the worst kinds of bug to handle, because it is incredibly hard to trace values being over-written by other values. In my experience, race conditions are probably a good 80% of what game programmers deal with. No wonder we are so frustrated all the time!</p>
|
||||
|
||||
<p>In my opinion, being forced to think about the order in which Systems run is a form of tight coupling, because it means you have to consider the behavior of other systems when writing a new system to avoid introducing bugs.</p>
|
||||
|
||||
<p>This example also illustrates another problem with ECS: in Systems that have similar behavior, we don’t really have a nice structure to share that behavior.</p>
|
||||
|
||||
<p>I have created a variant of ECS that intends to address these and other problems. Let me tell you about it.</p>
|
||||
|
||||
|
||||
<footer class=" footline" >
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div id="navigation">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-prev" href="/why/architecture/oop/" title="OOP"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/architecture/hyper_ecs/" title="Hyper ECS" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,560 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" class="js csstransforms3d">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="Hugo 0.55.6" />
|
||||
<meta name="description" content="">
|
||||
|
||||
|
||||
<link rel="icon" href="/images/favicon.png" type="image/png">
|
||||
|
||||
<title>Hyper ECS :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
display:none !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body class="" data-url="/why/architecture/hyper_ecs/">
|
||||
<nav id="sidebar" class="">
|
||||
|
||||
|
||||
|
||||
<div id="header-wrapper">
|
||||
<div id="header">
|
||||
<img src="/images/logo.png" width="100" height="100">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="searchbox">
|
||||
<label for="search-by"><i class="fas fa-search"></i></label>
|
||||
<input data-search-input id="search-by" type="search" placeholder="Search...">
|
||||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="highlightable">
|
||||
<ul class="topics">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item active">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="footer">
|
||||
<p>Built with <a href="https://github.com/matcornic/hugo-theme-learn"><i class="fas fa-heart"></i></a> from <a href="http://getgrav.org">Grav</a> and <a href="http://gohugo.io/">Hugo</a></p>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="body">
|
||||
<div id="overlay"></div>
|
||||
<div class="padding highlightable">
|
||||
|
||||
<div>
|
||||
<div id="top-bar">
|
||||
|
||||
|
||||
<div id="breadcrumbs" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">
|
||||
<span id="sidebar-toggle-span">
|
||||
<a href="#" id="sidebar-toggle" data-sidebar-toggle="">
|
||||
<i class="fas fa-bars"></i>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span id="toc-menu"><i class="fas fa-list-alt"></i></span>
|
||||
|
||||
<span class="links">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a href='/'>Encompass</a> > <a href='/why/'>Why?</a> > <a href='/why/architecture/'>Architecture</a> > Hyper ECS
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="progress">
|
||||
<div class="wrapper">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="head-tags">
|
||||
|
||||
</div>
|
||||
|
||||
<div id="body-inner">
|
||||
|
||||
<h1>
|
||||
|
||||
Hyper ECS
|
||||
</h1>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Hyper ECS is a new architecture pattern that attempts to address some common issues with standard ECS.</p>
|
||||
|
||||
<p>The core of the architecture is the introduction of a new construct to ECS: the <strong>Message</strong>.</p>
|
||||
|
||||
<p>A Message is fundamentally a variant of Component, in that it only contains data. But, it is designed to be temporary and is discarded at the end of each frame. It is used to communicate useful information between Systems.</p>
|
||||
|
||||
<p>We also introduce some extra information to Systems. Each System must declare the Messages that it <strong>Reads</strong>, the Messages that it <strong>Emits</strong>, and the Components that it <strong>Mutates</strong>.</p>
|
||||
|
||||
<p>Let’s go back to our earlier example.</p>
|
||||
|
||||
<p>We have TransformComponent, which contains position and orientation data, and VelocityComponent, which contains an <em>x</em> and <em>y</em> component for linear motion.</p>
|
||||
|
||||
<p>Our MotionDetecterSystem reads each Entity that has both a TransformComponent and a VelocityComponent, and emits a MotionMessage, which contains a reference to the specific TransformComponent and the <em>x</em> and <em>y</em> velocity given by the VelocityComponent.</p>
|
||||
|
||||
<p>We also have a TeleportSystem that needs to teleport the character forward a bit. Let’s say when the player presses the X button, a TeleportMessage is fired. The TeleportSystem reads this message and emits a MotionMessage in response.</p>
|
||||
|
||||
<p>Now we have our MotionSystem. The MotionSystem declares that it Mutates the TransformComponent, reads the MotionMessages that apply to each TransformComponent, and applies them simultaneously, adding their <em>x</em> and <em>y</em> values to the TransformComponent. Voilà! No race conditions! And we can re-use similar behaviors easily without re-writing code by consolidating Messages.</p>
|
||||
|
||||
<p>You might be wondering: how does the game know which order these systems need to be in?</p>
|
||||
|
||||
<p>With the power of graph theory, we can construct an order for our Systems so that any System which Emits a certain Message runs before any System that Reads the same Message. This means, when you write behavior for your game, you <em>never</em> have to specify the order in which your Systems run. You simply write code, and the Systems run in a valid order, every time, without surprising you.</p>
|
||||
|
||||
<p>Of course, to accomplish this, there are some restrictions that your Systems must follow.</p>
|
||||
|
||||
<p>Systems are not allowed to create message cycles: if System A emits Message B, which is read by System B which emits Message C, which is read by System A, then we cannot create a valid ordering of Systems. This is not a flaw in the architecture: A message cycle is simply evidence that you haven’t quite thought through what your Systems are doing, and can generally be easily eliminated by the introduction of a new System.</p>
|
||||
|
||||
<p>Two separate systems are not allowed to Mutate the same Component. Obviously, if we allowed this, we would introduce the possibility of two Systems changing the same component, creating a race condition. If we have two Systems where it makes sense to change the same Component, we can create a new Message and System to consolidate the changes, and avoid race conditions.</p>
|
||||
|
||||
<p>If you are used to programming games in an object-oriented way, you will likely find the ECS pattern counter-intuitive at first. But once you learn to think in a Hyper ECS way, you will be shocked at how flexible and simple your programs become.</p>
|
||||
|
||||
|
||||
<footer class=" footline" >
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div id="navigation">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-prev" href="/why/architecture/ecs/" title="ECS"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/architecture/mess/" title="The Messy Basement" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -9,23 +9,23 @@
|
|||
|
||||
<link rel="icon" href="/images/favicon.png" type="image/png">
|
||||
|
||||
<title> :: Encompass Docs</title>
|
||||
<title>Architecture :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558477076"></script>
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
|
|
@ -52,14 +52,14 @@
|
|||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -75,13 +75,13 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why" class="dd-item
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
|
@ -102,17 +102,127 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="" class="dd-item
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
parent
|
||||
active
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
|
@ -176,7 +286,7 @@
|
|||
|
||||
|
||||
|
||||
<a href='/'>Encompass</a> > <a href='/why/'>Why</a> >
|
||||
<a href='/'>Encompass</a> > <a href='/why/'>Why?</a> > Architecture
|
||||
|
||||
|
||||
|
||||
|
|
@ -205,7 +315,7 @@
|
|||
|
||||
<h1>
|
||||
|
||||
|
||||
Architecture
|
||||
</h1>
|
||||
|
||||
|
||||
|
|
@ -214,6 +324,9 @@
|
|||
|
||||
|
||||
|
||||
<p>Architecture simply means the basic structure of a program, and how things are added to the program. It is the foundation of everything you build.</p>
|
||||
|
||||
<p>All programs that you write have some kind of architecture, even if you haven’t really thought about it much. Let’s go over some different architectures and talk about their features.</p>
|
||||
|
||||
|
||||
|
||||
|
|
@ -294,10 +407,98 @@
|
|||
|
||||
|
||||
|
||||
<a class="nav nav-prev" href="/why/" title="Why"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-prev" href="/why/the_hard_way/" title="The Hard Way"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/architecture/mess/" title="The Messy Basement" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
|
@ -305,20 +506,20 @@
|
|||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558477076"></script>
|
||||
<script src="/js/jquery.sticky.js?1558477076"></script>
|
||||
<script src="/js/featherlight.min.js?1558477076"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558477076"></script>
|
||||
<script src="/js/highlight.pack.js?1558477076"></script>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558477076"></script>
|
||||
<script src="/js/learn.js?1558477076"></script>
|
||||
<script src="/js/hugo-learn.js?1558477076"></script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558477076" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558477076"></script>
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,14 +1,60 @@
|
|||
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>Encompass Docs</title>
|
||||
<title>Architecture on Encompass Docs</title>
|
||||
<link>http://example.org/why/architecture/</link>
|
||||
<description>Recent content on Encompass Docs</description>
|
||||
<description>Recent content in Architecture on Encompass Docs</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Tue, 21 May 2019 15:18:37 -0700</lastBuildDate>
|
||||
|
||||
<atom:link href="http://example.org/why/architecture/index.xml" rel="self" type="application/rss+xml" />
|
||||
|
||||
|
||||
<item>
|
||||
<title>The Messy Basement</title>
|
||||
<link>http://example.org/why/architecture/mess/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:48:10 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/mess/</guid>
|
||||
<description>Unexpected behavior jumps out at you constantly. You feel like you&rsquo;re playing whack-a-mole with bugs. You can&rsquo;t remember where you put anything and keeping everything sorted is a constant nightmare.
|
||||
Uh oh. You&rsquo;re in a messy basement.
|
||||
Some characteristics of the messy basement:
|
||||
Magic values, aka putting numbers directly in the source code. Game objects directly manipulating each other&rsquo;s values willy-nilly. Multiple objects that keep track of and depend on each other&rsquo;s state.</description>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>OOP</title>
|
||||
<link>http://example.org/why/architecture/oop/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:54:18 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/oop/</guid>
|
||||
<description>They call it OOP because it was a mistake. &ndash;Unknown
|
||||
You are probably very familiar with OOP, or object-oriented programming, as a game designer. It is the structural idea behind most games as they are written today, though this is slowly changing.
|
||||
OOP is a structure based on the concept of Objects. Objects contain both data, referred to as properties, and logic, referred to as methods.
|
||||
Object orientation is an intuitive idea when it comes to building simulation-oriented applications such as video games.</description>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>ECS</title>
|
||||
<link>http://example.org/why/architecture/ecs/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:55:45 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/ecs/</guid>
|
||||
<description>ECS stands for Entity-Component-System. It is based on two fundamental principles:
|
||||
There should be complete separation between data and logic. Objects should be created via composition and not inheritance. Components are the most basic element. They are simply containers of related data. In a 2D game we could have a PositionComponent with an x and y value. Components do not contain logic, though they might have callbacks to deal with side effects, for example creating or destroying bodies in a physics simulator.</description>
|
||||
</item>
|
||||
|
||||
<item>
|
||||
<title>Hyper ECS</title>
|
||||
<link>http://example.org/why/architecture/hyper_ecs/</link>
|
||||
<pubDate>Tue, 21 May 2019 15:56:13 -0700</pubDate>
|
||||
|
||||
<guid>http://example.org/why/architecture/hyper_ecs/</guid>
|
||||
<description>Hyper ECS is a new architecture pattern that attempts to address some common issues with standard ECS.
|
||||
The core of the architecture is the introduction of a new construct to ECS: the Message.
|
||||
A Message is fundamentally a variant of Component, in that it only contains data. But, it is designed to be temporary and is discarded at the end of each frame. It is used to communicate useful information between Systems.</description>
|
||||
</item>
|
||||
|
||||
</channel>
|
||||
</rss>
|
||||
|
|
@ -0,0 +1,548 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" class="js csstransforms3d">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="Hugo 0.55.6" />
|
||||
<meta name="description" content="">
|
||||
|
||||
|
||||
<link rel="icon" href="/images/favicon.png" type="image/png">
|
||||
|
||||
<title>The Messy Basement :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
display:none !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body class="" data-url="/why/architecture/mess/">
|
||||
<nav id="sidebar" class="">
|
||||
|
||||
|
||||
|
||||
<div id="header-wrapper">
|
||||
<div id="header">
|
||||
<img src="/images/logo.png" width="100" height="100">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="searchbox">
|
||||
<label for="search-by"><i class="fas fa-search"></i></label>
|
||||
<input data-search-input id="search-by" type="search" placeholder="Search...">
|
||||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="highlightable">
|
||||
<ul class="topics">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item active">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="footer">
|
||||
<p>Built with <a href="https://github.com/matcornic/hugo-theme-learn"><i class="fas fa-heart"></i></a> from <a href="http://getgrav.org">Grav</a> and <a href="http://gohugo.io/">Hugo</a></p>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="body">
|
||||
<div id="overlay"></div>
|
||||
<div class="padding highlightable">
|
||||
|
||||
<div>
|
||||
<div id="top-bar">
|
||||
|
||||
|
||||
<div id="breadcrumbs" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">
|
||||
<span id="sidebar-toggle-span">
|
||||
<a href="#" id="sidebar-toggle" data-sidebar-toggle="">
|
||||
<i class="fas fa-bars"></i>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span id="toc-menu"><i class="fas fa-list-alt"></i></span>
|
||||
|
||||
<span class="links">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a href='/'>Encompass</a> > <a href='/why/'>Why?</a> > <a href='/why/architecture/'>Architecture</a> > The Messy Basement
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="progress">
|
||||
<div class="wrapper">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="head-tags">
|
||||
|
||||
</div>
|
||||
|
||||
<div id="body-inner">
|
||||
|
||||
<h1>
|
||||
|
||||
The Messy Basement
|
||||
</h1>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>Unexpected behavior jumps out at you constantly. You feel like you’re playing whack-a-mole with bugs. You can’t remember where you put anything and keeping everything sorted is a constant nightmare.</p>
|
||||
|
||||
<p>Uh oh. You’re in a messy basement.</p>
|
||||
|
||||
<p>Some characteristics of the messy basement:</p>
|
||||
|
||||
<ul>
|
||||
<li>Magic values, aka putting numbers directly in the source code.</li>
|
||||
<li>Game objects directly manipulating each other’s values willy-nilly.</li>
|
||||
<li>Multiple objects that keep track of and depend on each other’s state.</li>
|
||||
</ul>
|
||||
|
||||
<p>The key characteristic of this structure is that there almost doesn’t seem to be any structure at all.</p>
|
||||
|
||||
<p>Shockingly, some game engines and frameworks not only fail to prevent this kind of architecture, they actually <em>encourage</em> it!</p>
|
||||
|
||||
<p>I don’t need to say much more about this kind of architecture. It’s obviously bad. Let’s move on.</p>
|
||||
|
||||
|
||||
<footer class=" footline" >
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div id="navigation">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-prev" href="/why/architecture/" title="Architecture"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/architecture/oop/" title="OOP" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -0,0 +1,555 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" class="js csstransforms3d">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="Hugo 0.55.6" />
|
||||
<meta name="description" content="">
|
||||
|
||||
|
||||
<link rel="icon" href="/images/favicon.png" type="image/png">
|
||||
|
||||
<title>OOP :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
display:none !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body class="" data-url="/why/architecture/oop/">
|
||||
<nav id="sidebar" class="">
|
||||
|
||||
|
||||
|
||||
<div id="header-wrapper">
|
||||
<div id="header">
|
||||
<img src="/images/logo.png" width="100" height="100">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="searchbox">
|
||||
<label for="search-by"><i class="fas fa-search"></i></label>
|
||||
<input data-search-input id="search-by" type="search" placeholder="Search...">
|
||||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="highlightable">
|
||||
<ul class="topics">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item active">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="footer">
|
||||
<p>Built with <a href="https://github.com/matcornic/hugo-theme-learn"><i class="fas fa-heart"></i></a> from <a href="http://getgrav.org">Grav</a> and <a href="http://gohugo.io/">Hugo</a></p>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="body">
|
||||
<div id="overlay"></div>
|
||||
<div class="padding highlightable">
|
||||
|
||||
<div>
|
||||
<div id="top-bar">
|
||||
|
||||
|
||||
<div id="breadcrumbs" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">
|
||||
<span id="sidebar-toggle-span">
|
||||
<a href="#" id="sidebar-toggle" data-sidebar-toggle="">
|
||||
<i class="fas fa-bars"></i>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span id="toc-menu"><i class="fas fa-list-alt"></i></span>
|
||||
|
||||
<span class="links">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a href='/'>Encompass</a> > <a href='/why/'>Why?</a> > <a href='/why/architecture/'>Architecture</a> > OOP
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="progress">
|
||||
<div class="wrapper">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="head-tags">
|
||||
|
||||
</div>
|
||||
|
||||
<div id="body-inner">
|
||||
|
||||
<h1>
|
||||
|
||||
OOP
|
||||
</h1>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p><em>They call it OOP because it was a mistake. –Unknown</em></p>
|
||||
|
||||
<p>You are probably very familiar with OOP, or object-oriented programming, as a game designer. It is the structural idea behind most games as they are written today, though this is slowly changing.</p>
|
||||
|
||||
<p>OOP is a structure based on the concept of <strong>Objects</strong>. Objects contain both data, referred to as <em>properties</em>, and logic, referred to as <em>methods</em>.</p>
|
||||
|
||||
<p>Object orientation is an intuitive idea when it comes to building simulation-oriented applications such as video games. We think of each “thing” in the game as a self-contained object which can be acted upon externally via methods. For example, in the game Asteroids, we could think of the game this way: the ship is an object, the bullets the ship fires are objects, the asteroids are objects, and so on.</p>
|
||||
|
||||
<p>Unfortunately, things aren’t quite this simple when it comes to more complex games.</p>
|
||||
|
||||
<p>As programmers we want to re-use code as much as possible. Every bit of duplication is an opportunity for bugs to lurk in our program. Object-oriented code accomplishes re-use with a concept called <em>inheritance</em>. With inheritance, classes can be partially based on other classes. Maybe a Ball class has a position and a velocity and a bounciness property. A BouncyBall would inherit from Ball and have a greater value in its bounciness property. Simple enough, right?</p>
|
||||
|
||||
<p>But we soon run into problems. In game development we often wish to mix-and-match behaviors. Suppose I have an object where it would make sense to inherit from <em>two</em> different classes. Now… we are hosed! Why? If two parent classes have a property or a method with the same name, now our child object has no idea what to do. Object-oriented systems, in fact, forbid multiple inheritance. So we end up having to share code via helper functions, or giant manager classes, or other awkward patterns.</p>
|
||||
|
||||
<p>We also run into an issue called <em>tight coupling</em>. Objects that reference each other’s properties or methods directly become a problem when we change the structure of those objects in any way. If we modify the structure of object B, and object A references object B, then we have to also modify object A. In a particularly poorly structured system, we might have to modify a dozen objects just to make a slight modification to the behavior of a single object.</p>
|
||||
|
||||
<p>Tight coupling is our worst nightmare as game programmers. Games are, by nature, extremely complex simulations. The more coupling we have between objects, the more of the entire environment of the game we have to understand before we can pick apart the specific behavior of a single object, let alone the whole game itself. It is very possible that we can surprise ourselves by unexpectedly changing the behavior of different objects when modifying a single object. And we hate surprises.</p>
|
||||
|
||||
<p>We want our architecture to encourage us to create as little coupling as possible between different elements of the game, so that we can look at any individual element of the game and easily understand how it behaves without needing to deeply understand the other elements of the game. We also wish to modify behavior without introducing unexpected changes in other seemingly unrelated objects. OOP works in very specific encapsulated cases, but it is not a satisfactory structure for implementing game behavior.</p>
|
||||
|
||||
<p>It turns out there is an architecture that addresses our desire to be able to compose objects out of several different behaviors. Let’s learn about it.</p>
|
||||
|
||||
|
||||
<footer class=" footline" >
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div id="navigation">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-prev" href="/why/architecture/mess/" title="The Messy Basement"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/architecture/ecs/" title="ECS" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
||||
|
|
@ -9,23 +9,23 @@
|
|||
|
||||
<link rel="icon" href="/images/favicon.png" type="image/png">
|
||||
|
||||
<title>Why :: Encompass Docs</title>
|
||||
<title>Why? :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558477076" rel="stylesheet">
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558477076"></script>
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
|
|
@ -52,14 +52,14 @@
|
|||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558477076"></script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -75,13 +75,13 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why" class="dd-item
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
parent
|
||||
active
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
|
@ -102,17 +102,127 @@
|
|||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="" class="dd-item
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
|
@ -170,7 +280,7 @@
|
|||
|
||||
|
||||
|
||||
<a href='/'>Encompass</a> > Why
|
||||
<a href='/'>Encompass</a> > Why?
|
||||
|
||||
|
||||
|
||||
|
|
@ -266,6 +376,86 @@
|
|||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
|
@ -290,7 +480,7 @@
|
|||
<a class="nav nav-prev" href="/" title="Encompass"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/architecture/" title="" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
<a class="nav nav-next" href="/why/the_hard_way/" title="The Hard Way" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
|
@ -300,20 +490,20 @@
|
|||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558477076"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558477076"></script>
|
||||
<script src="/js/jquery.sticky.js?1558477076"></script>
|
||||
<script src="/js/featherlight.min.js?1558477076"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558477076"></script>
|
||||
<script src="/js/highlight.pack.js?1558477076"></script>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558477076"></script>
|
||||
<script src="/js/learn.js?1558477076"></script>
|
||||
<script src="/js/hugo-learn.js?1558477076"></script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558477076" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558477076"></script>
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
|
|
|||
|
|
@ -1,9 +1,9 @@
|
|||
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>Why on Encompass Docs</title>
|
||||
<title>Why? on Encompass Docs</title>
|
||||
<link>http://example.org/why/</link>
|
||||
<description>Recent content in Why on Encompass Docs</description>
|
||||
<description>Recent content in Why? on Encompass Docs</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Tue, 21 May 2019 14:25:56 -0700</lastBuildDate>
|
||||
|
|
|
|||
|
|
@ -0,0 +1,540 @@
|
|||
<!DOCTYPE html>
|
||||
<html lang="en" class="js csstransforms3d">
|
||||
<head>
|
||||
<meta charset="utf-8">
|
||||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||||
<meta name="generator" content="Hugo 0.55.6" />
|
||||
<meta name="description" content="">
|
||||
|
||||
|
||||
<link rel="icon" href="/images/favicon.png" type="image/png">
|
||||
|
||||
<title>The Hard Way :: Encompass Docs</title>
|
||||
|
||||
|
||||
<link href="/css/nucleus.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/fontawesome-all.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hybrid.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/featherlight.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/perfect-scrollbar.min.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/auto-complete.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/atom-one-dark-reasonable.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/theme.css?1558486144" rel="stylesheet">
|
||||
<link href="/css/hugo-theme.css?1558486144" rel="stylesheet">
|
||||
|
||||
<link href="/css/theme-encompass.css?1558486144" rel="stylesheet">
|
||||
|
||||
|
||||
<script src="/js/jquery-3.3.1.min.js?1558486144"></script>
|
||||
|
||||
<style type="text/css">
|
||||
:root #header + #content > #left > #rlblock_left{
|
||||
display:none !important;
|
||||
}
|
||||
|
||||
</style>
|
||||
|
||||
</head>
|
||||
<body class="" data-url="/why/the_hard_way/">
|
||||
<nav id="sidebar" class="">
|
||||
|
||||
|
||||
|
||||
<div id="header-wrapper">
|
||||
<div id="header">
|
||||
<img src="/images/logo.png" width="100" height="100">
|
||||
|
||||
</div>
|
||||
|
||||
<div class="searchbox">
|
||||
<label for="search-by"><i class="fas fa-search"></i></label>
|
||||
<input data-search-input id="search-by" type="search" placeholder="Search...">
|
||||
<span data-search-clear=""><i class="fas fa-times"></i></span>
|
||||
</div>
|
||||
|
||||
<script type="text/javascript" src="/js/lunr.min.js?1558486144"></script>
|
||||
<script type="text/javascript" src="/js/auto-complete.js?1558486144"></script>
|
||||
<script type="text/javascript">
|
||||
|
||||
var baseurl = "http:\/\/example.org\/";
|
||||
|
||||
</script>
|
||||
<script type="text/javascript" src="/js/search.js?1558486144"></script>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div class="highlightable">
|
||||
<ul class="topics">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/" title="Why?" class="dd-item
|
||||
parent
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/">
|
||||
<b>1. </b>Why?
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/the_hard_way/" title="The Hard Way" class="dd-item
|
||||
parent
|
||||
active
|
||||
|
||||
">
|
||||
<a href="/why/the_hard_way/">
|
||||
The Hard Way
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/" title="Architecture" class="dd-item
|
||||
|
||||
|
||||
|
||||
">
|
||||
<a href="/why/architecture/">
|
||||
Architecture
|
||||
|
||||
</a>
|
||||
|
||||
|
||||
<ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/mess/" title="The Messy Basement" class="dd-item ">
|
||||
<a href="/why/architecture/mess/">
|
||||
The Messy Basement
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/oop/" title="OOP" class="dd-item ">
|
||||
<a href="/why/architecture/oop/">
|
||||
OOP
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/ecs/" title="ECS" class="dd-item ">
|
||||
<a href="/why/architecture/ecs/">
|
||||
ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<li data-nav-id="/why/architecture/hyper_ecs/" title="Hyper ECS" class="dd-item ">
|
||||
<a href="/why/architecture/hyper_ecs/">
|
||||
Hyper ECS
|
||||
|
||||
</a>
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
</li>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</ul>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="footer">
|
||||
<p>Built with <a href="https://github.com/matcornic/hugo-theme-learn"><i class="fas fa-heart"></i></a> from <a href="http://getgrav.org">Grav</a> and <a href="http://gohugo.io/">Hugo</a></p>
|
||||
|
||||
</section>
|
||||
</div>
|
||||
</nav>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<section id="body">
|
||||
<div id="overlay"></div>
|
||||
<div class="padding highlightable">
|
||||
|
||||
<div>
|
||||
<div id="top-bar">
|
||||
|
||||
|
||||
<div id="breadcrumbs" itemscope="" itemtype="http://data-vocabulary.org/Breadcrumb">
|
||||
<span id="sidebar-toggle-span">
|
||||
<a href="#" id="sidebar-toggle" data-sidebar-toggle="">
|
||||
<i class="fas fa-bars"></i>
|
||||
</a>
|
||||
</span>
|
||||
|
||||
<span id="toc-menu"><i class="fas fa-list-alt"></i></span>
|
||||
|
||||
<span class="links">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a href='/'>Encompass</a> > <a href='/why/'>Why?</a> > The Hard Way
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
</span>
|
||||
</div>
|
||||
|
||||
<div class="progress">
|
||||
<div class="wrapper">
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
</div>
|
||||
|
||||
<div id="head-tags">
|
||||
|
||||
</div>
|
||||
|
||||
<div id="body-inner">
|
||||
|
||||
<h1>
|
||||
|
||||
The Hard Way
|
||||
</h1>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<p>If you’re reading this, you have probably been frustrated by code you wrote.</p>
|
||||
|
||||
<p>Maybe a feature that you thought would take a few hours took a few days. Or a few weeks.</p>
|
||||
|
||||
<p>Maybe a bug you fixed a month ago came back and you can’t stand the idea of trying to fix it again.</p>
|
||||
|
||||
<p>Maybe you stare at your screen for hours wondering where a new structure could possibly fit into your program.</p>
|
||||
|
||||
<p>Maybe you find yourself screaming <strong>WHY!!!!</strong> at your computer and throwing something across the room.</p>
|
||||
|
||||
<p>I’m here to tell you that coding a game doesn’t have to be this hard.</p>
|
||||
|
||||
<p>Just say it with me. <em>It doesn’t have to be this hard.</em> It doesn’t!</p>
|
||||
|
||||
<p>The road to recovery starts with some basic structural ideas and a little bit of discipline.</p>
|
||||
|
||||
<p>Come along with me, won’t you? Let’s write some good code.</p>
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<footer class=" footline" >
|
||||
|
||||
</footer>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
<div id="navigation">
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
|
||||
<a class="nav nav-prev" href="/why/" title="Why?"> <i class="fa fa-chevron-left"></i></a>
|
||||
|
||||
|
||||
<a class="nav nav-next" href="/why/architecture/" title="Architecture" style="margin-right: 0px;"><i class="fa fa-chevron-right"></i></a>
|
||||
|
||||
|
||||
</div>
|
||||
|
||||
</section>
|
||||
|
||||
<div style="left: -1000px; overflow: scroll; position: absolute; top: -1000px; border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;">
|
||||
<div style="border: none; box-sizing: content-box; height: 200px; margin: 0px; padding: 0px; width: 200px;"></div>
|
||||
</div>
|
||||
<script src="/js/clipboard.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.min.js?1558486144"></script>
|
||||
<script src="/js/perfect-scrollbar.jquery.min.js?1558486144"></script>
|
||||
<script src="/js/jquery.sticky.js?1558486144"></script>
|
||||
<script src="/js/featherlight.min.js?1558486144"></script>
|
||||
<script src="/js/html5shiv-printshiv.min.js?1558486144"></script>
|
||||
<script src="/js/highlight.pack.js?1558486144"></script>
|
||||
<script>hljs.initHighlightingOnLoad();</script>
|
||||
<script src="/js/modernizr.custom-3.6.0.js?1558486144"></script>
|
||||
<script src="/js/learn.js?1558486144"></script>
|
||||
<script src="/js/hugo-learn.js?1558486144"></script>
|
||||
|
||||
<link href="/mermaid/mermaid.css?1558486144" type="text/css" rel="stylesheet" />
|
||||
<script src="/mermaid/mermaid.js?1558486144"></script>
|
||||
<script>
|
||||
mermaid.initialize({ startOnLoad: true });
|
||||
</script>
|
||||
|
||||
|
||||
</body>
|
||||
</html>
|
||||
|
|
@ -0,0 +1,15 @@
|
|||
<?xml version="1.0" encoding="utf-8" standalone="yes" ?>
|
||||
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom">
|
||||
<channel>
|
||||
<title>The Hard Way on Encompass Docs</title>
|
||||
<link>http://example.org/why/the_hard_way/</link>
|
||||
<description>Recent content in The Hard Way on Encompass Docs</description>
|
||||
<generator>Hugo -- gohugo.io</generator>
|
||||
<language>en-us</language>
|
||||
<lastBuildDate>Tue, 21 May 2019 15:20:55 -0700</lastBuildDate>
|
||||
|
||||
<atom:link href="http://example.org/why/the_hard_way/index.xml" rel="self" type="application/rss+xml" />
|
||||
|
||||
|
||||
</channel>
|
||||
</rss>
|
||||
Loading…
Reference in New Issue