ビューステートを意識したVisualforce【セールスフォース】

<!-- wp:paragraph -->
<p>こんにちは、アンダーソンです。<br>今回は上級デベロッパーの勉強中に気になったシリーズです。<br>ビューステートにも制限があるようで、上級デベロッパーともなると、<br>そのあたりのことも頭に入れた設計をしていく必要があるようです。<br>今回はビューステートに関して考察していきます。</p>
<!-- /wp:paragraph -->

<!-- wp:separator -->
<hr class="wp-block-separator"/>
<!-- /wp:separator -->

<!-- wp:heading {"level":3} -->
<h3>ビューステートの制限</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>そもそもビューステートとはなんなのでしょうか。<br>Visualforceでカスタムコントローラを呼び出す際に表示させるバインドされた変数だ何だことだと認識しています。<br>※もっといい説明あったら教えてください。</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>てなことで、画面に表示できる情報は無限ではなく、<strong>135KB</strong>の制限を設けているわけですね。<br>これもガバナ制限みたいなものなので覚えてしまいましょう。<br>で、もし制限を超えてしまったらどうなるのか。</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>Visualforceはもちろんエラーで返されますし、VF側のエラーなのでApex側で例外をキャッチするなどは<br>当然できません。<br>かなりの曲者と言えるでしょう。</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>ビューステートを確認</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>今回、取引先責任者を単純に1000件表示させる画面を作ってみました。<br>表示させるのは名前のみです。<br>まずは普通にやってみた際のビューステートのサイズをみてみます。</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">Visualforce
&lt;apex:page controller="sample" action="{!sample}"&gt;
    &lt;apex:form &gt;
        &lt;apex:repeat value="{!conList}" var="con"&gt;
            &lt;apex:inputField value="{!con.LastName}"/&gt;
        &lt;/apex:repeat&gt;
    &lt;apex:form/&gt;
&lt;apex:page/&gt;

Apex
public class sample {
    public List conList {get; set;}

    public void sample(){
        conList = [SELECT Id,LastName FROM Contact LIMIT 1000];
    }
}</pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p>かなり簡易的ですがこれを実行してみます。</p>
<!-- /wp:paragraph -->

<!-- wp:image {"id":1152,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><img src="https://keneloper.com/wp-content/uploads/2020/02/スクリーンショット-2020-02-08-13.15.55-1024x206.png" alt="" class="wp-image-1152"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>conListのサイズは7.22KBとなっています。Internalというのも同じくらいサイズがありますが、<br>これはSalesforce側内部のステートで開発者側ではどうすることもできないようです。</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>ビューステートの最適化</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>ビューステートを軽減するためにはどうするのがいいのでしょうか。<br>そこで下記の方法をとるのがベストプラクティスとのことです。</p>
<!-- /wp:paragraph -->

<!-- wp:list -->
<ul><li>状態の維持に不可欠ではなく、ページの更新時にも不要な変数には、Apex コントローラで&nbsp;transient&nbsp;キーワードを使用する。</li><li>ビューステートの大部分をコントローラまたはコントローラ拡張で使用されているオブジェクトから取得していることが分かった場合は、Visualforce ページに関連するデータのみを戻すように SOQL コールの絞り込みを検討する。</li><li>ビューステートが大規模なコンポーネントツリーの影響を受けている場合は、ページが依存しているコンポーネント数の削減を試みる。<br>引用：<a href="https://developer.salesforce.com/docs/atlas.ja-jp.216.0.salesforce_visualforce_best_practices.meta/salesforce_visualforce_best_practices/pages_best_practices_perf_code_view_state.htm">ビューステートの最適化</a></li></ul>
<!-- /wp:list -->

<!-- wp:paragraph -->
<p>①そもそものコンポーネント数を考えなさいよ〜。<br>②SOQLを見直して適切なデータだけ戻そうね。<br><strong>③特段状態維持しなくていいならtransientを使用しようね。</strong></p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>というものです。<br>①はいわずもがな表示の見直しをすればいいのですが、<br>②はコントローラで取得するSOQLそのものを見直すべきかもしれません。<br>例えば、先ほどのコントローラでContactオブジェクトの全ての項目をSELECTしてみます。<br>すると一気にビューステートでのサイズが増えます。</p>
<!-- /wp:paragraph -->

<!-- wp:image {"id":1153,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><img src="https://keneloper.com/wp-content/uploads/2020/02/スクリーンショット-2020-02-08-13.28.02-1024x206.png" alt="" class="wp-image-1153"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>SOQLで無駄な項目の取得は避けましょうということですね。<br>そして③はそもそもビューステートから無くしちゃおうという作戦です。</p>
<!-- /wp:paragraph -->

<!-- wp:paragraph -->
<p>先ほどのコードのApex側を書き換えます。</p>
<!-- /wp:paragraph -->

<!-- wp:preformatted -->
<pre class="wp-block-preformatted">transient public List conList {get; set;}</pre>
<!-- /wp:preformatted -->

<!-- wp:paragraph -->
<p>これだけです。宣言の際にtransientを最初につけます。<br>すると同じページなのに、</p>
<!-- /wp:paragraph -->

<!-- wp:image {"id":1154,"sizeSlug":"large"} -->
<figure class="wp-block-image size-large"><img src="https://keneloper.com/wp-content/uploads/2020/02/スクリーンショット-2020-02-08-13.32.24-1024x206.png" alt="" class="wp-image-1154"/></figure>
<!-- /wp:image -->

<!-- wp:paragraph -->
<p>この違いです。29.31KBあったのが8.08まで削減されました。</p>
<!-- /wp:paragraph -->

<!-- wp:heading {"level":3} -->
<h3>デメリット</h3>
<!-- /wp:heading -->

<!-- wp:paragraph -->
<p>transientにもデメリットがあります。<br>ページの更新時に不要な変数につけておかないと何かしらのアクションでページの変更が加わったりすると<br>無かったことになるので注意が必要です。<br>transientがある変数は状態の変更などには使えないため、あくまでも大量データを表示させる<br>output用の変数と頭に入れておくのがいいと思います。</p>
<!-- /wp:paragraph -->