# 2018年の振り返り(技術編)

# はじめに

2019年がはじまり既に5日めになりました。
少し遅ればせながら2018年の振り返りをしていきましょう。

本当は技術関連以外も書こうかと思ったんですが思った以上に長くなってしまったので、技術関連だけで一旦まとめました。

目次

# JavaScript

# Nuxt.js

昨年一番触れたのはjsでありNuxt.jsであったと言える1年でした。
Nuxtに関しては1系になる前から触ってはいたんですが、環境構築周りからかなり整備されています。

公式のドキュメント自体翻訳がきちんと進んでいるので、公式を読んでいれば問題なく導入できるかと思いますが、 そのほかに日本語の書籍も充実してきているので今始めるのは非常にいいタイミングだと感じます。

個人的には以下の2冊が非常におすすめです。

# SPAとSEO

Nuxtだけではなく当然SPAとしてのVue.jsにも多く触れた一年でした。
と言ってもSEOの問題が付きまとうページではSPA単独での運用は難しく、Vue.jsでSPA作って終わりという案件は減ってきた印象です。

今の所ServerSideRenderingを導入することで解決をしていますが、 新しく第4の選択肢としてのダイナミックレンダリングという方策も出てきているようです。

ダイナミックレンダリングの使用方法

簡単にいうと通常のユーザーにはクライアントサイドレンダリングしたコンテンツを返して
クローラにはサーバーからレンダラを経由し、サーバーサイドレンダリングされたコンテンツを返す仕組みです。

上記リンクにもあくまでクローラ向けの回避策である旨が触れられています。

ダイナミック レンダリングはクローラ向けの回避策であることに注意してください。

これ自体もかなり力技な印象を受けるので、当座はSSRで対応していくのが一番シンプルでいいような気もしています。

# SPAの状態管理

以前Vuexに管理を集中させすぎるあまり、コンポーネント間の関係性が密になりすぎて見通しが極端に悪くなったプロダクトがありました。

storeにおけるstateはviewとdataを分離して管理するという意味では非常に素晴らしいと思うのですが、 あれは「お行儀の良いグローバル変数」のようなものとして認識していないと、気づかぬ内にそれぞれのコンポーネントが非常に密に絡み合って見通しが悪くなって行きます。

どのstateがそのコンポーネント固有のものなのか見極めて、 極力storeに依存しない作りをしていくことが見通しの良いプロダクトを作るコツかと思います。

TIP

localとglobalで使用するstate一例

local : その画面だけで使用されるアコーディオンの開閉状態を記録するstate
global : 全てページで使用する、ユーザーがログインしているかどうかのstate

# css

# css設計

全てがグローバルであるというcssの特性上ある程度以上のプロダクトだと、破綻しないようにcssをどのように設計するのかは付きまとう問題です。

個人的には今の所vueの単一ファイルコンポーネントでローカルスコープを作りつつ、
css全体の設計としてはatomicデザインやFLOCSSなどの概念をうまく組み合わせて設計をしていくのがいいと感じています。 この辺りの話はまたcssの設計に絞って書く予定です。

# Houdini

一年くらい前に社内の勉強会でHoudiniを扱ったんですがその頃からあんまり変わっていない印象です。 相変わらずchrome以外ではほぼ未実装であるし、特定のAPIによってはchromeすら反応なしという状態です。

参考

ただ一部実装されているPaintAPIなどにしても、どう言った場面で使われるのかはまだ未知数な部分が多いと感じています。 デジタルアートの分野や一部の尖ったクリエイトのなかでちょっとづつ使われていくとは思いますが、一般的なサイトでどのように使用するかに関してはまだ判断が難しい部分かと思います。

# html

JavaScriptやcssに比べると落ち着いている印象はあります。
html5自体もスタンダードになってからかなりの月日が立っていることもあり、最近はhtml5以外で書くこともほぼなくなってきました。

最近はフレームワーク内で使う一部としてhtmlを書いている印象が強く、
htmlそのものがどういう情勢なのか追い切れているとは言いづらい部分はあります。

# その他

# アクセシビリティ

アクセシビリティに関しては去年はかなり盛り上がった一年だったんじゃないでしょうか。
参加した勉強会などでもよく名前を聞きましたし、html5confluenceなどの主要なカンファレンスでもセッションがありました。

ただ実際に業務の中でアクセシビリティをやるとなると、直接的に数字を生み出す施策としては打ち出しづらいため後回しになりがちなのは事実です。

またある程度チームの中でアクセシビリティに関しての知見が共有されていないと
アクセシビリティに詳しい一部のエンジニアやコーダーに負荷が集中しがちです。

かくいう自分自身まだアクセシビリティをうまく啓蒙できているとは言い難いので、 文字のコンストラスト比であったり、色覚障害の事例を交えたりしながら啓蒙をしようとしている最中です。

# HTTP3とか5Gとか

html5Confluenceで5Gに関してのセッションを拝聴したんですが、 あくまで試験環境ではあるので一概には言えないと思いますが、5Gを入れれば諸々がすぐに解決とはならない印象を受けました。

年末にはHTTP/3なんていう新しいHTTPの仕様の話が出てきたりもしてますし、 今年もこの辺りは引き続き追っていく必要は感じています。

# いわゆるWebについての振り返り

昨日平成ネット史という番組がNHKでやってました。
ほんの数年、十数年の話のはずなんですが隔世の感がすごかった番組でした。

最近周りの人ともよく話すんですが、テレホーダイで11時待って朝までゲーム、 なんて世代からすると本当に時代が変わったなぁという印象です。

昔のようにデータのDLに何時間もかけるようなことなんてないし、SNSをはじめ発信の場所はいくらでもある。そういう意味では非常に面白い時代だと思います。

反面誰しもが意識せずにネットと繋がれるので、気づいたら炎上していたりすることもあるでしょうし
自分と他人の境界線がどこにあって、どこまでが世界に見られているのか意識することが難しい時代だと感じます。

なんだかカオスだったwebの頃も思い出しつつ、
今のトレンドもあの頃と同じように面白がりながら触れていく2019年にして行きたいものです。