はじめまして、新卒フロントエンドエンジニアのぺいです。 JX通信社でフロントエンドの開発はReactが主流になっており、React Hooksを使った開発が欠かせません。hooksは便利な反面、適材適所使い所を理解していないと逆にパフォーマンスが悪くなってしまう場合があります。そこで今回は普段フロントエンドを書かない人も勉強会に参加するのを考慮し簡単な改善から応用としてReactで書かれたFASTALERT *1の改善まで行ってもらいました。 前提条件 勉強会の内容 再レンダリングされているコンポーネントを見つける なぜ再レンダリングされてしまうのか 改善方法 コンポーネントのメモ化 関数のメモ化 最終的な変更箇所 毎回コンポーネントや関数をメモ化すべきなのか コストの高い計算 無駄なレンダリング カスタムhooks 最後に 参考 前提条件 react 17.0.1 勉強会の内容 最終的な

この記事は、Slack Advent Calendar＆JX 通信社 Advent Calendarの最終日です。 メリークリスマス！ 素敵なクリスマスをお過ごしでしょうか。取締役の小笠原(@yamitzky)です。 突然ですが、みなさん、ダークモードは好きですか？　ダークモードは昨今のソフトウェアのトレンドで、Slack のデスクトップ版も今年の 9 月にダークモードに対応しました。 slackhq.com しかし Slack をダークモードに設定すると、透過背景・黒文字なカスタム絵文字が見づらいという問題がありました。Slack が仕事のワークフローの中心にある JX 通信社にとって、これは死活問題です。 そこで、Slack の闇の魔術(ダークモード)に Python で対抗し、これらの絵文字が見えるようにしたいと思います！ 方針 基本方針は簡単です。黒背景に黒文字だと見づらいのが原因

※最新版（2021年バージョン）がこちらにありますので合わせてご覧ください！ 毎年恒例, Python本と学び方の総まとめです！*1 プログラミング, エンジニアリングに機械学習と今年（2019年）もPythonにとって賑やかな一年となりました. 今年もたくさん出てきたPythonの書籍や事例などを元に, 初心者向けの書籍・学び方 仕事にする方（中級者）へのオススメ書籍 プロを目指す・もうプロな人でキャリアチェンジを考えている方へのオススメ を余す所無くご紹介します. 来年（2020年）に向けての準備の参考になれば幸いです. ※ちなみに過去に2019, 2018, 2017と3回ほどやってます*2. このエントリーの著者&免責事項 Shinichi Nakagawa（@shinyorke） 株式会社JX通信社 シニア・エンジニア, 主にデータ基盤・分析を担当. Python歴はおおよそ9年

「JX通信社Advent Calendar 2019」24日目の記事です. 昨日は@kimihiro_nさんによる, 「Immutable Python ~ NamedTuple で書く副作用のないプログラム」の話でした. こんにちは. JX通信社でシニア・エンジニア&データ基盤エンジニアおよび野球*1をしています, @shinyorke（しんよーく）と申します. JX通信社では, データ駆動での意思決定および施策実施をより円滑に進めるため, データ基盤の構築・運用を進めています. その過程でいろんなFrameworkやサービスを試して...の一つの成果として以前こんな話をしました.*2 tech.jxpress.net このエントリーではもうちょっとプラットフォーム・基盤に寄り添ったテーマで, 同僚氏に「K8sいいぞ！」と布教活動を受けた結果, 4日で本番運用までこぎつけた話 をしたいと

この記事はJX通信社 Advent Calendar 2019 の23日めの記事です。 昨日は Yosk さんの 名刺作成をデザイナーの業務から外して、効率化させた話 でした。 こんにちは、サーバーサイドエンジニアの @kimihiro_n です。 今回は Python の Immutable を最大限活用してみる話を書いてみます。 【2019/12/23 訂正 1 】 : NamedTupleを使う際、同値であればオブジェクト自体も同一であると書いてましたがこちらは誤りでした。 個々の id を調べてみると別々のオブジェクトが割り当てられていたため、記事の表現を一部修正しました。 【2019/12/24 訂正 2 】: コメントにて、Java の String オブジェクトも不変であるというご指摘をいただきました。 不変であることとオブジェクトが同一であることの性質を混同してしまっていた

「JX通信社Advent Calendar 2019」10日目の記事です. 昨日は, @rychhrさんの「Pure WebSocketsをサポートしたAWS AppSyncでWebとiOS間のリアルタイムチャットを作ってみた(1)」でした. 改めまして, こんにちは. JX通信社でシニア・エンジニア&データ基盤エンジニアをしています, @shinyorke（しんよーく）と申します. JX通信社では, データ駆動での意思決定および施策実施をより円滑に進めるため, データ基盤の構築・運用を進めながらトライアル的に様々なFrameworkやツールの検証を行っています.*1 このエントリーでは, 私がシュッとPySparkで分散処理をする...前に, 手元で試したときの感想とその知見 のお話を残していきたいと思います. なお, 分散処理そのものの知見・ノウハウではなく, する前にPySparkに

「JX通信社Advent Calendar 2019」7 日目の記事です。昨日は、鈴木（泰）さんの「CodePipelineを用いたLambdaのデプロイについての所感」でした。 フロントエンドエンジニアの渡辺です。今回は社内の管理画面のUIの話です。 はじめに 管理画面、特に社内向けの画面を作る際は、プロダクト側とは少し事情が異なり、 それぞれのコンポーネントのデザインにあまりこだわらない 機能面や、使い勝手の優先度が高い などの事情があります。なので、UIとしては、「このフレームワークに乗っかっておけばコンポーネントが揃っている」という状態が理想です。 JX通信社の管理画面はVue.jsを使っているケースが多く、その際のUIフレームワークにはiViewを使っています。 特徴 基本的にデザインがシンプル カスタマイズできる項目が多い 少し特殊な用途(無限スクロール、ツリー構造のチェックボ

この記事はJX通信社 Advent Calendar 2019の1日目の記事です。 こんにちは、SREのたっち(TatchNicolas)です。 先日開催されたKubeCon 2019でもセッションで紹介されていた、Admission Webhooksについて書きます。 Admission WebhooksとはKubernetesリソースを操作(CREATE/UPDATE)する時に、作成や変更の内容をチェックしたり、書き換えたりすることができる機能です。 TL;DR Admission Webhooksを使うと、あらゆるKubernetesリソースの操作をトリガーに 「チェック(Validation)」「変更(Mutation)」 を行える 身近なところでは、Istioでサイドカーのauto-injectionで使われています どの種類のリソースにどんな操作をするときにWebhookを呼ぶ

この記事はJX通信社 Advent Calendar 2019 2日目の記事です。 昨日は、たっちさんの「Kubernetes Admission Webhookでリソース作成を自在にコントロールする」でした。 こんにちは、サーバーサイドエンジニアの @kimihiro_n です。 今回は長年動かしてた Scala のマイクロサービスのリビルドを行った話をしようと思います。 TL;DR 新しい言語を投入するのにマイクロサービスは便利 Scala で感じていた問題点を解消しつつ Go へ移行できた 消費メモリが大きく減って安定稼働できるようになった 予防線を貼っておきますと、Scala より Go のほうがいいよね、といった本旨ではありません。 Scala で書いたマイクロサービス 弊社のマイクロサービスの一つにカテゴリ分類専用のサービスが存在します。 カテゴリやキーワードを登録しておくとル

「JX通信社Advent Calendar 2019」3日目の記事です.*1 昨日は, @kimihiro_nさんの「Scala で書いたマイクロサービスを Go で書き直した話」でした. 改めまして, こんにちは. JX通信社でエンジニアをしています, @shinyorke（しんよーく）と申します. 今年の10月に入社してから, CTO室*2のデータ・エンジニアとして基盤の構築から運用のサポートまで色々しています. ちなみに趣味は野球のデータ分析です.*3 入社後最初のエントリーとして, 私が好きかつ情熱を持って育てているデータ基盤の話を語りたい...ところですが！？ 入社してプロジェクト内でやった言語化は記録・知見として残しておきたい. 世の中, アジャイルなやり方・プラクティスは多数あれどデータ・サイエンスや分析という文脈での言及って案外少ない. チームメンバー以外からの評判も良かっ

この記事はJX通信社 Advent Calendar 2019 6日目の記事です。 Flutter に Firebase Authentication と Facebook認証を組み合わせる話 こんにちは、Flutter(Andorid)エンジニアのぬまっちです。(@nuMatch) 先月は登壇してきましたブログ tech.jxpress.net を投稿しました。 記事の最後に予告した通り、今回はFlutter と Firebaseの相性の良さについて筆を走らせたいと思います。 特にFirebase Authentication と Facebook認証が今回の主役になります。 おしながき ログイン機構と3つのF Firebase Authentication の仕組みについて Flutter側での実装 ログイン機構と3つのF 初めに、この記事は Flutterでクロスプラットフォームアプ

この記事は JX 通信社アドベントカレンダー、GraphQL アドベントカレンダーの4日目です こんにちは、JX通信社の小笠原(@yamitzky)です。普段はエンジニア部門の統括をしています。 弊社の NewsDigest ではアプリ向けのバックグラウンド API として GraphQL を使っています(サーバーは gqlgen、アプリはライブラリなし)。 tech.jxpress.net GraphQL の技術スタックとしては Apollo というライブラリが有名だと思うのですが、弊社では使ったことがありませんでした。そこで、今年の 9 月に箱根で開催した開発合宿にて、Apollo Client(React) と Apollo Server の検証を行いました。 Apollo Client を使うときに唯一鬼門だったのが、Apollo の持っているキャッシュ機構です。本日は、Apoll

はじめに インターンでお世話になっている、コウゲと申します。現在担当させていただいている仕事は業務で使用している管理画面のマイクロサービス化です。 マイクロサービス間をつなぐ認証機能が必要だったので、認証プラットフォームとして使いやすそうな 「Auth0」で どんなことができるのか、実現したいことは可能なのかを検証してみることになりました。 なぜAuth0なのか ダッシュボードの設定 + 少ないコード で認証機能が簡単に実装できる。 Auth0専用ライブラリやSDKが多数存在し、目的に応じてそれを利用することで 簡単にログイン機能を実装することができる。 実現したいこと 発表 ありがたいことに、調べた結果を社内で発表する場を設けていただきました。 ブログの内容より少し詳しく書いています。読んだら即実装できるようなスライドを心がけて作りました! speakerdeck.c