リファクタリングすべきか・してよいかの判断基準 - 千里霧中
リファクタリングは、設計やコードを綺麗に保つという普遍的に求められる活動の一要素です。常識的な習慣として推進すべき活動です。 ただ、有効性の理解を得られないままリファクタリングを行って物議を醸す場面も存在します（例えばここのはてなブックマーク等で巻き起こった議論などです）。 実際、リファクタリングは、以降の保守作業をサポートしてこそ価値がでるものであり、考えなしにいつでも一律実施すればよいというものではありません。リファクタリングの対象やチームの状況によって、リファクタリングをすべきかどうか、線引きがされます。 このリファクタリングをすべきかどうかの基準ですが、一言でまとめると「妥当な保守性の実現を、妥当な費用対効果で実現できるか」になります。今回はこの基準を構成する「妥当な保守性の実現」と「妥当な費用対効果」について、それぞれ解説します。 リファクタリングで妥当な保守性を実現できるかの基
「尖った人ではなく、暗黙知を形式知に変換する人がほしい」 “均質人材”を育成してきた日本でこれから求められる能力とは
「プログラミングを学ぶ」ではなく「要件定義を学ぶ」 田中邦裕氏（以下、田中）：あと13分ぐらいになったので、今後の展望にいきたいのですが、その前に、質問が7個ほど来ているので、みなさんに聞きたいと思います。 一番投票数が多い質問が、「非エンジニアでAIを使ったスマホアプリを作りたいんだけれども、プログラミングをそもそも学ぶべきか？」という質問です。 生成AIがある今、何をどのように学ぶべきなのか。プログラムを学ぶべきなのか、それ以外になにか手段があるのか。目的によっても違うのですが、ざっくりとしたこの質問に対して、なにか答えられる方はいますか？ 比戸将平氏（以下、比戸）：じゃあ、私から。 田中：はい、お願いします。 比戸：先週ぐらいに、NVIDIAのジェンスン（Jensen Huang氏）が、「今後はAIがプログラムを書くから、もうプログラムを学ぶ必要はないよ」と発言したのが切り取られて、
フロントエンドのスピードに置いていかれたので、よく聞く技術を調べて分類してみた
元フルスタックエンジニア(死語)をやらせていただいていたものです。 JavaScript(TS)周りの進歩が凄く、あまりにもついていけていなかったので、気になったワードを片っ端から整理してみました。 それぞれに対する説明の正しくないものが含まれてしまっている可能性があります。 そんなところを見つけたときは優しく教えてくださると助かります。 各ツールの詳細というよりは、それぞれがどんな役割のものなのかを記載しています。 この記事が誰かの助けになれば幸いです。 調査・分類した言葉(技術)たち Hono Bun Deno Biome Vite Webpack Turbopack esbuild Babel SWC Prisma まず上記に上げたものが、どういった機能を持つものなのかもわかりませんでした。 それを整理すると以下になるようです。 JavaScript Runtime Deno Bun
差別語の三相を見つめて適切に距離を取る - やしお
小説を商業出版することになり、これまで自分で書いて見直すだけだったのが、編集者・校正者による校正・校閲のプロセスを初めて体験した。その過程で差別語・差別表現に関しての指摘を受けて、改めて自分の中での判断について少し整理しておきたいと思った。 ある言葉が持つニュートラル、ネガティブ、ポジティブの三相を同時に見ないと、「その言葉をここで使うのが適切か」は判断ができないけれど、三相のうち一面しか見なかったり知らなかったりすると正確に判断ができなかったり、話が噛み合わなくなったりする。 指摘を受けた点1 「発狂」や「狂人」に指摘が入った。 江戸時代に実在したという届出「発狂扱ひ」に言及した箇所に指摘が入った時はどうしようかとも考えて、「精神状態の異常による行動という届け出」と言い換えた。 明治時代に精神障害者が「狂病者」と呼称され、「狂」に否定的・差別的な意味あいが付与されてきた。1970年代に「
setTimeout の真の力、あなたは知っていますか？ - Qiita
こんにちは。ぬこすけ です。 皆さんは「 setTimeout とはどんな関数でしょう？」と聞いたら、どう答えますか？ おそらく、ほとんどの人が「指定した時間に処理が走るようにする関数」と答えるのではないでしょうか？ function main() { console.log('動いたよ！！'); } // 大体 ３ 秒後に main 関数が動き出す setTimeout(main, 3000); 大雑把な理解としては問題ないですが、実は setTimeout の隠された能力はそれだけではありません。 setTimeout の隠された能力を知るとどんな良いことがあるのでしょうか？ 例えば、次のような良いことがあります。 ブラウザに対する理解が深まる Web サイトのパフォーマンスを向上させることができる ドヤれる まず、 ブラウザに対する理解が深まります 。 かのアリストテレスはこう言い残
ISUCON13に参加して4位になりました (187,577点) - ぷらすのブログ
こんにちは、@p1ass です。 去年に引き続き、 @km_conner と @atrn0 と一緒にチーム「釜中の鯖」として ISUCON13 に参加しました。 結果は187,577 点で総合 4 位になりました。わいわい 🙌 4 位 187,577 釜中の鯖 今年新たに導入した文明の利器 毎年 ISUCON に参加している我々ですが、ISUCON で使うツール群はあまりアップデートされていませんでした。 しかし、時代は移り変わり、世の中には便利なツールがたくさん増えていたようです。 そこで、今年から新たに 3 つのツールを導入して ISUCON に挑むことにしました。 Tailscale Tailscaleは Wireguard プロトコルを使った VPN SaaS です。 Tailscale を使うとほんの少しの設定だけで Mac や Linux、Docker コンテナといった様々
認知負荷および認知負荷理論 (Cognitive Load Theory) をもう少し正確に理解するための心理学研究・知見の紹介
認知負荷および認知負荷理論 (Cognitive Load Theory) をもう少し正確に理解するための心理学研究・知見の紹介 この記事の目的 ここ数年で、ソフトウェア開発やプログラミングの文脈で、「認知負荷」 および 「認知負荷理論」 という用語をよく見聞きするようになりました。私が今思い出せるだけでも、以下のような書籍や Podcast で重要なキーワードとして取り上げられています。 A Philosophy of Software Design, 2nd Edition チームトポロジー 価値あるソフトウェアをすばやく届ける適応型組織設計 プログラマー脳 ～優れたプログラマーになるための認知科学に基づくアプローチ fukabori.fm 102. A Philosophy of Software Design (3/3) w/ twada この「認知負荷」ですが、少なくとも近年見聞
ChatGPT API を基礎から理解する - Qiita
概要 この記事では、ChatGPT の API を利用してプロダクトを開発するために必要な基礎知識を解説します。 ChatGPT プラグインや LangChain などの仕組みを理解し、ライブラリに頼らなくても実装できるようになることを目指します。 ChatGPT API の裏側 ChatGPT で会話をしている時、返答が一気に全て表示されず、徐々に出てくるのを不思議に思ったことはないでしょうか。これは単なる視覚的な演出ではありません。実際に一単語ずつ時間をかけて生成されています。 基礎となる GPT のモデルは、入力されたテキスト (プロンプト) の次に来る確率が高い単語を予測します。 このモデルをもとにして ChatGPT がどう実装されるのか、順を追って見ていきましょう。 Completions OpenAI の API には、プロンプトに続く文章を補完してくれる Completio
IPA情報セキュリティ10大脅威 知っておきたい用語や仕組み2023年5月.pdf
情報セキュリティ 10 大脅威 知っておきたい用語や仕組み 2023 年 5 月 目次 はじめに......................................................................................................................................................... 3 1 章. 理解は必須！ ...................................................................................................................................... 5 1.1. 脆弱性（ぜいじゃくせい） .............................
Reactを自作しよう
この記事は Build your own React を翻訳したものです。 Reactを1から書き直していきます。 実際のReactコードのアーキテクチャに従いますが、最適化機能と必須ではない機能は今回は実装しません。 Step 1: createElement関数 Step 2: render関数 Step 3: 並列モード Step 4: ファイバー Step 5: Render Phase と Commit Phase Step 6: 差分検出 Step 7: 関数コンポーネント Step 8: Hooks Step 0 復習 最初にいくつかの基本的な概念を確認しましょう。 React、JSX、およびDOM要素がどのように機能するかをすでに理解している場合は、この章はスキップしても構いません。 今回は、次のわずか3行のコードをReactアプリの例として使用します。 const ele
原理から考えるCSSアニメーションのパフォーマンス改善
ブラウザに描画されるWebページをデジタルイラストに例えて、レンダリングの仕組みからCSSアニメーションのパフォーマンスを考える視点を解説します。 また、近い将来、GPUアクセラレーションをはじめとするパフォーマンス事情がどう変わっていくのかについても触れ、新たに主流になるかもしれないアニメーション実装手法をご紹介します。 本記事は、TechFeed Experts Night#14 〜 絶対役立つ！最先端のCSS総ざらいのセッション書き起こし記事になります。 イベントページのタイムテーブルから、その他のセッションに関する記事もお読み頂けますので、一度アクセスしてみてください。 本セッションの登壇者 セッション動画 今回はブラウザのレンダリングの大まかな仕組みから、CSSアニメーションのパフォーマンスを予測できるようになるというお話をしたいと思います。実際にChromeで計測した数値をまじ
Introducing historical web performance data via the CrUX History API - Chrome Developers
Introducing historical web performance data via the CrUX History API Published on Tuesday, February 7, 2023 This article introduces the Chrome UX Report (CrUX) History API endpoint, which provides time series of web performance data. This data updates weekly, and allows you to see about 6 months worth of history, with 25 data points spaced out by a week. When used with the daily updates from the o
What's new in Lighthouse 10 | Blog | Chrome for Developers
Lighthouse is a website auditing tool that helps developers with opportunities and diagnostics to improve the user experience of their sites. Lighthouse 10 is available immediately on the command line through npm and in Chrome Canary. It will land in Chrome stable in Chrome 112 and in PageSpeed Insights in the coming weeks. Scoring changes The venerable Time To Interactive (TTI) metric is being re
TypeScript 4.9のas const satisfiesが便利。型チェックとwidening防止を同時に行う
TypeScript 4.9 から、satisfies operator が使えるようになりました。従来のas constと組み合わせ、型チェックと widening 防止を同時に行えます。筆者的には、"顧客が本当に必要だったもの"です。 本記事では satisfies とは何か？ as const とは何か？ 2つを組合わせるとどのようなメリットがあるのか？ について、実際のコードと共に解説します。 結論 TypeScriptで 定数を export する場合は、as const satisfies を設定しておくと便利です。 export const myName = "田中" as const satisfies string; export const foodList = { ramen: "ラーメン", udon: "うどん", soba: "そば" } as const sa
Speculation Rules API によるプリレンダリングのためのメトリクス設計
本記事では Speculation Rules API を使ったプリレンダリングの性能評価を行うためのメトリクスについて紹介します。 はじめに ウェブページの読み込みは本質的に時間のかかる処理です。ウェブブラウザは HTML ファイルを解析することでページ表示に必要なリソースを特定・収集・処理し、それらを組み合わせてページの描画（レンダリング）を行います。 ページ読み込みを高速化するアプローチの一つとして投機実行が知られています。投機実行はページ読み込みに必要な処理をあらかじめ実行しておくことで、実際にページを描画するときの処理を減らします。ウェブブラウザにはこのような投機実行を行うための API が多数実装されています。若干情報が古くなっていますが「リソースの読み込みを助けるウェブブラウザ API の世界」という記事に投機実行のための API をまとめたので詳しくはそちらを見てください。
Optimize Time to First Byte | Articles | web.dev
Optimize Time to First Byte Stay organized with collections Save and categorize content based on your preferences. Time to First Byte (TTFB) is a foundational web performance metric that precedes every other meaningful user experience metric such as First Contentful Paint (FCP) and Largest Contentful Paint (LCP). This means that high TTFB values add time to the metrics that follow it. It's recomme
「自分に似たスタッフ」を求めてしまう管理職の呪いと解呪 | サイボウズ式
マネジメント 新しいチームのあり方を探求 就活 就活生必見！サイボウズの疑問 ティール組織 会社の「あたりまえ」が変わる 多様性 100人100通りの個性 ワークスタイル 働き方、生き方、もっと自由に 青野慶久 サイボウズ社長の想いと覚悟 キャリア 人生の「積み上げ方」を見直す 複業 複数の「本業」をもつ働き方 人事制度 多様な働き方を支える仕組み マンガ サクッと手軽に読める！ 皆さんこんにちは。中間管理職の編集長、たられば（@tarareba722）です。 今回サイボウズさんより、「多様性」というテーマでエッセイの依頼をいただきました。 多様性、いろいろと考えたすえわたくしに思いついたのは、（政治政策や社会制度の話ではなく）身の回りの仕事のことでした。中間管理職の皆さまが一度は必ずぶつかる問題、「スタッフは自分のコピー（のような能力を持つ人材）がいいか問題」です。 「自分のコピー」を欲
Next.js の Zod 活用術
本年は Next.js + バリデーションライブラリの Zod をよく利用し、Zenn でもいくつかの関連記事を投稿しました。本稿では、この組み合わせならではの TIPS を紹介します。記事で紹介するサンプルは以下に置いています。 リクエスト検証に便利な Zod Next.js で getServerSideProps を使用すると、リクエスト検証をサーバーサイドで行えます。例えばセッションに保持している値の検証はバリデーションライブラリの Zod を使用して、次のようなコードで実現できます。 export const userSchema = z.object({ name: z.string(), email: z.string(), }); export const getServerSideProps = async (ctx) => { const sess = await ge
SWR v2 をリリースしました
メンテナとして関わっていた SWR v2 がリリースされましたので紹介したいと思います。 各機能の細かい紹介については、リリースブログを確認してください。日本語翻訳も行ったので日本語で読むこともできます。 https://swr.vercel.app/ja/blog/swr-v2 ここでは、ざっくりと補足を書きたいと思います。 Mutation 周り useSWRMutation 一番わかりやすいのは、新しい useSWRMutation という Hook が追加されたことです。swr/mutation から import できます。 import useSWRMutation from 'swr/mutation' async function sendRequest(url, { arg }) { return fetch(url, { method: 'POST', body: JS
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
core-js/docs/2023-02-14-so-whats-next.md at master · zloirock/core-js
