content_for とラベル付き yield の実行順について

やりたいこと

既存のコントローラーに影響を与えずに新規コントローラーで読み込むJSやCSSを変えたい

これまで application.html.erb のヘッダは固定で jQuery2 bootstrap3 application.js/css を読み込んでいたのですが
今後追加するページでは jQuery3 や jQueryUI, bootstrap4 を使いたいです

###試したこと

layouts/application.html.erb　

<head>
<% render 'header' %>
<%= yield :stylesheet_link %>
<%= yield :javascript_include %>
</head>
<body>
<% yield %>
</body>

という感じでヘッダの出力をサブビューに任せて

_header.html.erb

<% content_for :stylesheet_link do %>
  <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/css/bootstrap.min.css" />
  <%= stylesheet_link_tag  'application', media: 'all', 'data-turbolinks-track' => true %>
<% end -%>

のようにサブビュー内でこれまでの出力をもってきます

<% content_for :javascript_include do %>
  <script src="https://code.jquery.com/jquery-2.1.4.min.js" data-turbolinks-eval=false></script>
  <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.4/js/bootstrap.min.js" data-turbolinks-eval=false></script>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
<% end -%>

という感じでかくことで既存ページはそのまま動くのですが

新規ページでは new_page/_header.html.erb をつくってオーバーライドして

<% content_for :javascript_include do %>
  <script src="https://code.jquery.com/jquery-3.3.1.min.js" data-turbolinks-eval=false></script>

をかいたところうまく jQuery3 におきかえることができたんですがさらに

使うページでだけ jQueryUI をいれたくて
たとえば new_page/index.html.erb に

<% content_for :javascript_include do %>
  <script src="https://code.jquery.com/ui/jquery-ui-git.js" data-turbolinks-eval=false></script>

をかいたところヘッダ出力順が

<script src="https://code.jquery.com/ui/jquery-ui-git.js" data-turbolinks-eval=false>
<script src="https://code.jquery.com/jquery-3.3.1.min.js" data-turbolinks-eval=false>

になってしまいます

ソースの記述順としては
render 'header' ( この中で content_for :head )
yield :header
yield ( index.html.erb をよぶ )
index 内で content_for :head
となっているのですが content_for の実行はどういう順で行われるのでしょうか

先に jQuery を出力して末端の部品のインクルードはその後で行いたいです

また content_for の中身を追加するだけでなく view 内で上書きやリセットする方法はありますでしょうか