maki-o memo

制作に関する私的なメモです

TalkNote Vol.8「TalkNote × Frontrend」に参加しました

6/8(土)に、TalkNote Vol.8「TalkNote × Frontrend」に参加してきました。

TalkNote第8回開催について。詳しくはこちら

先月の福井に続いての遠征。
セッション内容は以下です。

  • 「ちゃんとCSSを書くために - CSS/Sass設計の話」 - 谷 拓樹さん
  • 「JavaScript開発の効率アップ」 - 平木 聡さん
  • 「レンダリングを意識したパフォーマンスチューニング」 - 水野 隼登さん
  • 「アーキテクチャを意識したJavaScript入門」 - 佐藤 歩さん

セッション内容

谷さん

CSS の設計のお話し。

CSSは、簡単に、冗長にそれらしく、書けてしまう。
それは自分には問題ないが、後任者やチーム内の他の人間、若しくは、明後日の自分には問題がありますよ、というお話し。
CSSの設計に必要なのは、

  • PREDICTABLE 予測しやすい
  • REUSABLE 再利用しやすい
  • MAINTAINABLE 保守しやすい
  • SCALABLE 拡張しやすい

の、4点。
この4点を踏まえ、どういう設計をしていったらよいか、Sassではどういう書き方ができるか、などのお話しでした。

今現在業務では、Sassを採用しています。
確かに、油断していると安易に入れ子にしてしまったり、継承関係が複雑だったり、
命名規則がバラバラ、そもそもどこに記述があるのか、等々。

bootstrapに代表されるCSSフレームワークを見ると、役割ごとに設計・記述されているのが、ぱっと見ただけでもわかります。
できれば日々の案件でもこのような設計ができればなーと思ってはいますが、なんとなーく頭では思い描けても、会社のメンバー内で意識を共有することがなかなか難しかったりします。
それぞれの会社のフローによってもそのあたりって変わってくると思うので、少しでも最適解に近づけるよう考えたいと思いました。

あと、SMACSSのこの本
最近よく聞くんですが英語なんですよねー。えいご。。。うーん。
はー。(遠い目

平木さん

js開発に役立つツールのお話し。

ChromeのデベロッパーツールなどのGUIのものはもちろん、CUIのツールも紹介されてました。

ちょっと前まではこういったWeb系の勉強会で、ツールと聞いてCUIのものが出てくることってあまりなかったんじゃないでしょうか。
ぼく自身、知ってるツールのほうが少なかったですが(GUI含め)、やっぱりもうフロントのことでもコマンドラインの操作は必須じゃないですかね。
スライドにコマンド出てきて、「あー、黒い画面かー」って拒否反応でるだけで、そのツールを使う機会とか逸してしまうこともあるのではないかと思いました。

セッション内容関係ない感想ですね。。。
ツール大事ですよね。知ってる知らないで全然違う。
知らないで損することにはならないようにしたい。

水野さん

チューニングのお話し。

やー、リフローとかペイントとかって概念はじめて知りました。
ChromeのCanaryも知らんかったー。かなりー勉強不足。。

知らない概念ということで、かなりー(しつこい)勉強になったのですが、現状の業務は当然のこと、いままでjsでここまでパフォーマンスを追求されたことってありません。
既にできているもの・パフォーマンスを追求されないもの(+納期の差し迫ったもの)に関しては、なかなか手をかけることが難しいような気がします。

ただ、概念を知っていれば、レンダリングのコストがかかりにくいコードを書くようにするでしょう。
たとえそのままリリースをしたとしても、なにも知らない状態で書いたものよりかはなんぼかマシになると思われます。
というわけです。

佐藤さん

Backbone.jsのお話し。

今まではjQueryだけでなんとかなっていました。
しかし、大規模なWebアプリのようなものをつくる場合には今のままではしんどいから、jsのMVCフレームワーク使って、ある程度の秩序を維持しつつ、メンテナンス性もよくなるし、早く帰れるし、そうゆう方向性のほうがみんな幸せじゃないですか。という内容。

去年末からちょいちょい最近のjsMVCフレームワークには触る機会があり、なんとなく概念がわかってきたところです。
ただ、継続的に業務とかで触れる機会もないので、そろそろなんか自分で作ってみないとダメですねー。。。

ただ、こういうフレームワークを使ったからといって、必ずしも役割ごとに見通しの良い実装が実現するわけではなく、実装する人の設計ポリシーというか設計モラルというか、MVCフレームワークであればMVCを意識して書いてるかとか影響してくると思われます。
なので、チームでの作業になるのであれば、それぞれが好き勝手書いてよいわけではなく、その会社なりプロジェクト内でのルールは必要になるのだろなと思いました。

まとめ

フロントエンドのことだけで4セッション。
なかなか実践できてないばかりか、まだまだ知らないことも多かったです。
全部をいきなり実践てのもなかなか難しいので、できるとこ・考えれるとこから実践していきたいと思います。
とりあえずSassの設計はちゃんと考えたい。

このTalknote Vol.8ですが、100人の定員に対して50人強という参加者だったみたいです。
しかも参加者には自分も含め、名古屋とか他の地方から来ている方も多数見られました。
4セッションとも実装系のお話しということが影響しているんでしょうか。自身で実装やらない方も、概念を知ってる知らないではだいぶ違うと思うんですけどね。そのへんどうなんでしょう。

なにせ、お昼に食べたさわやかのハンバーグうまかったー。
静岡2回目ですが、懇親会まだ行けてないので、次の機会には参加したいと思います。
ありがとうございました!


プロフィール

フロントエンドエンジニア

Tomokazu Makita

名古屋でフリーランスでWeb制作してます。 フロントエンドのことを主にやってます。
a-blog cmsを使用したサイト制作が得意です。
お仕事のご相談随時受付中。

雪山大すき。冬は雪山の合間に仕事します。
財布はいつも吹雪です。

エントリーリスト

タグ