はてなブックマーク

概要 学習済 LLM(大規模言語モデル)のパラメータ数と食うメモリ容量（予想含む）、ホストできるGPUを調べたメモ　※適宜修正、拡充していく。 左半分：LLMのパラメータ数と、必要な GPU メモリ(fp16換算) 右半分：その基盤モデルの推論をするなら、どんなGPUなら実行可能で、それっていくら？　の参考値 読み方： 手元で使う夢 ボーナスで買ったグラボ程度では相手にしてもらえんの 巨大なモデルをコンシューマ向けグラボやT4レベルでなんとか使う夢 量子化 fp16(16bit) を 8bit にする fp16(16bit) を 4bit にする https://github.com/nomic-ai/gpt4all とか FlexGen https://github.com/FMInference/FlexGen 巨大なモデルをメモリやSSDなどを活用してなんとか使う 調査元データ諸元

概要 JavaScriptのテストフレームワークJestをES6+Babel7の環境で使う方法について書きます 仕掛けを理解するために、ゼロからnpmプロジェクトを作っていきます npmプロジェクトを作る

概要 Webpackを使ってNode.jsとブラウザに両対応したライブラリを作るときのレシピ集です いろいろなレシピを見てWebpackによるライブラリ生成の挙動を理解することを目的としています ブラウザにもNode.jsにも両対応したライブラリを作りたい ブラウザとNode.jsに両対応したいとおもったとき、 両方同時に対応した1つのバンドルjsを作る【統合型】と、 ブラウザ用、Node.js用と別々にライブラリを出し分ける【出し分け型】の2パターンある。 本稿では主に【統合型】について説明する ライブラリのビルドに関するWebpack設定項目 レシピ集に行く前に、 まず、ライブラリのビルドに関する設定項目をざっくりみていく。 webpack.config.js 以下のような典型的なwebpack.config.jsの中でoutput以下の項目でライブラリ生成のためのパラメータを決める。

概要 npmプロジェクトで利用しているnpmパッケージ(依存パッケージ)でvulnerability(脆弱性)が見つかったときの対処フローについて記載します。 （GitHub等が親切に"We found potential security vulnerabilities in your dependencies."のように通知してくれるので便利）

概要 Tableをソートするライブラリを書きました 外部ライブラリなどは不要 シンプルなので素のHTMLやBootstrapなど特にフレームワーク縛りなく使える ソートのみが欲しかったので容量小さめ ソースコードはこちらで公開しています https://github.com/riversun/sortable-table NPMパッケージ化したものはこちら https://www.npmjs.com/package/@riversun/sortable-table デモ See the Pen sortable-table (with Bootstrap4) by Tom Misawa (@riversun) on CodePen. 使い方 TableのHTML sortable-tableクラスをもった要素以下にtable theadを置く th要素にdata-id属性でデータとひもづけ

概要 ブラウザｘJavaScriptで扱うキーボードイベント、キー判定にどのプロパティを使うかのまとめ　です ざっくりいうと　event.key　または　event.code のどちらかを使うべし 「●●が押されたら」のような判定をしたいときは event.key または event.code のどちらかで判定する。 キー判定には、いろんなプロパティがあって、どれ使ったらいいの？と悩むことがある 以前ふつうにつかっていた event.keyCode等はdeprecatedになっている

package.jsonで環境変数(NODE_ENV)を設定するとき、WindowsでもLinux,Macでも動くようにするJavaScriptNode.jspackage.json環境変数 概要 npm startしたいときpackage.jsonで環境変数(たとえばNODE_ENV)をセットしつつ起動したいときcross-envをつかうと実行環境がWindowsなのかLinux、Macなのか、といったプラットフォームを意識しなくて良いようにする 使用前→Linux用とWindows用で書き換える必要あり スクリプトは以下のようになる Linux,Macなら

概要 JavaScriptで以下のようなオブジェクトをマージする方法について書きます。 本題は深いマージ(deep merge,deep copy)です ※functionが存在しないプロパティのみのオブジェクトを想定 const a = { familyName: '織田', firstName: '吉法師', address: '尾張', sex: '男', details: { character: { favoriteTactics: '奇襲', favoriteWord: '天下布武', favoritePlace: '京' }, ownedCastle: [ '清洲城' ] } }; const b = { familyName: '織田', firstName: '信長', details: { character: { favoriteTactics: '鉄砲活用' },

概要 JavaでWeb APIを利用するときに良く使う JSON→Java、Java→JSON のやり方についてまとめます また、JSONをHTTP POSTしたりHTTP GETしたりする方法は次の記事でまとめます。 【本稿】JavaでJSONを扱う方法についてまとめます JSONをJavaに変換(デシリアライズ)、JavaをJSONに変換(シリアライズ)するやり方は2通り説明します ライブラリにGSONを使うやり方 ライブラリにJacksonを使うやり方 【次稿】JavaでHTTP通信でJSONをPOSTしたり、GETしたりする方法についてもまとめます JavaでHTTP通信をするやり方も2通り説明します OkHttp3を使ったやり方 Java標準パッケージであるHttpUrlConnectionを使ったやり方 最短コース　～JSONありきで考える～ 外部APIをたたく時など、パースし

概要 ffmpegで動画のアスペクト比を維持したまま縮小（拡大）する方法 ffmpegで動画の解像度を指定しリサイズ(サイズを変更)する方法 アスペクト比を維持したままリサイズ 自動で設定したいほうに -1 をセットする 例 動画の横幅(width)を 1280 にする。高さ(height)はアスペクト比を維持して自動で設定する

概要 機械学習の回帰問題において評価関数としてよく出てくる MSE(mean squared error,平均二乗誤差) とは一体何なのか。 山登りのように、ふもとから一歩ずつふみしめながら理解をすすめていく記録となります。 （必要な数式の導出過程も省略せず記録しました） とうことで、さっそく山登り開始します 1合目：母集団・母平均 登り始める前に、準備運動。統計用語をおさらい 「日本人成人男性の平均身長調査」 を題材に、考えてみる。 選挙年齢が引き下げられたので　成人＝18歳以上　とすると　日本人のうち　成人　に該当するのは　約1億人。　そのうち男性が約半数なので、日本人成人男性は5000万人程度と考える。 母集団（ぼしゅうだん、population） 母集団とは、調査対象となる数値、属性等の源泉となる集合全体 平均身長調査で考えると、母集団とは対象者全員ということになる。 つまり母集団

ゼロから始めるJavaでAWS Elastic Beanstalk ＃１～ EB CLIを使ったJava Webアプリ環境構築 ～JavaAWSjettyElasticBeanstalk 概要 AWS Elastic Beanstalkを使えば、EC2でのOSやミドルウェアのセットアップ不要でコマンド1つでWebアプリ実行環境を構築することができます。セキュリティパッチ等も自動適用できるため運用が軽くなるメリットもある上、ベースはEC2等AWSのコンポーネントの組み合わせなので、その気になれば色々カスタマイズもできるという、とても使い勝手の良いサービスです。 本稿ではEB CLIというツールをつかってコマンド1つでJava Web アプリの実行環境を構築します。 Java Webアプリは、Tomcatで動作するWARではなく、Java SEでつくったスッピンのWebアプリ(JAR)が対象で

ゼロから始めるAWS Elastic Beanstalk ＃２～ 独自ドメイン対応、HTTPS対応、HTTP→HTTPSへのリダイレクト対応、Auto Scaling設定 ～JavaAWSelbElasticBeanstalk 概要 ゼロから始めるJavaでAWS Elastic Beanstalk ＃１～ EB CLIを使ったJava Webアプリ環境構築 ～の続編です Elastic Beanstalkで構築するWebアプリを以下のようにします HTTPS対応 独自ドメイン対応 うっかりHTTPでリクエスト来たらHTTPSにリダイレクト Auto Scalingは不要 ということで、以下のように構成するときの設定例をみていきます 本編 ALB(Application Load Balancer)をHTTPSに対応する Elastic BeanstalkでつくったWebアプリをHTTPS

概要 ■ expressにwebpack-dev-serverを組み込むことにより以下のようなことを可能にします フロントエンド側変更してもブラウザの手動リロードいらず サーバー側変更しても、サーバー(express on node.js)の手動再起動いらず つまり、「ソースを変更したら、フロントエンド側もサーバー側もオートリロードする」ような環境設定の方法を説明します。 これができると、フロントエンドもサーバーもコードを変更したらすぐに反映し動作確認ができるようになりプチハッピーです。 ■ 実現方法 webpack-dev-middlewareとwebpack-hot-middlewareをexpressに組み込むことにより、比較的カンタンに実現できます。 ■ 環境 サーバーはexpressが前提となります フロントエンド開発にはバンドラーとしてwebpackを使います ReactやVu

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

概要 Java言語で「JavaScriptのPromiseライクな文法で、非同期処理・並行処理を記述してみたい」と思いやってみました。 ソースは以下リポジトリにあります https://github.com/riversun/java-promise コード例 「非同期処理１が終わったら、その結果を使った非同期処理２が実行される」処理はJavaではどのように書けば良いでしょうか？ 解1:Java1.4時代の解：Threadクラスの機能でがんばる Threadを入れ子式に持つとか、joinで終了待ちとか。並列処理黎明期。 解2:Java5(1.5)時代の解：Callable/Futureで幸せになれたのかな・・・ Future/Callableで結果返せてうれしい、加えセマフォやラッチなど小道具そろったがそれなりに頑張る必要あり。 解3:Java8時代の解：CompletableFuture

Linuxインストール用のUSBメモリ(Live USB)を作成する まず、Linuxをインストールするために、インストール用のUSBメモリ(Live USB)を作成するところから開始する。 USBメモリへの書き込みにはWindows PCを利用した例で説明するが、書き込みアプリはWindow版、Mac版、Linux版があり、どれも同じ手順でインストール用USBメモリを作成可能。 Ubuntu 18.04のディスクイメージは 2GB程度なので、USBメモリは8GBもあれば十分。 Ubuntu 18.04のディスクイメージのダウンロード Linuxのディストリビューションには、Ubuntu 18.04 LTSを使用する。 https://www.ubuntu.com にアクセスして、Downloadタブを開いて、Ubuntu Desktop > 18.04 LTS をクリックすると、Ubun

概要 JavaScriptでチャットボットのUIを爆速で作るためのガイドです。 スマートフォン および PCブラウザ に両対応 scriptタグを1つ入れるだけで既存のコンテンツをジャマしないチャットUI 【作ったチャットボットデモこちらです】 2024年3月更新 : LLM(大規模言語モデル) を用いてトークンを逐次生成するストリーミングチャットを構築したいときは 本稿の手法よりも (株)Qualiteg 提供の ChatStream のほうがオススメです 対象読者 Java Scriptが書ける人(初心者でもOK) node.js環境がある人(npmまたはyarnが使える) チャットボットに興味がある人 できること 以下のデモのようなPCブラウザとスマホに両対応したチャットボットUIを作ります スマホの場合は画面にフィットしたチャットUI、PCブラウザの場合はフローティングする小窓にチ

僕たちはいつまでこんな楽しいAndroid Studio設定をし続けるのか？ Android Studio 3.x時代の設定不足解消メモAndroidgradleAndroidStudio 概要 本稿はAndroid Studio 2.x世代に開発したアプリをAndroid Studio 3.x世代でビルドするときに遭遇した事象と対策のメモです。 Androidアプリを開発していると、頻繁に開発環境のアップデートがあります 開発環境をアップデートすると頻繁に古いプロジェクトがビルドできなくなります （昔は通用したのに、今は通用しなくなる） ビルドの成否に影響を及ぼす要素 Android Studioのバージョン Gradleのバージョン Android Pluginのバージョン SDK Build Toolsのバージョン Android Plugin Repositoryの場所 Defau

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

概要 Font Awesome(フォントオーサム)はFreeで使えるアイコン集で、このジャンルでほぼデファクトといって良い存在になっています。Free版とPro版がありますがFree版でも約1500種類のアイコンが使えます。 本稿では、node.js環境での開発を前提としたWebフロントエンド開発で Font Awesome5 を使う時のポイントを説明します。Font Awesomeはv5になってフロントエンド開発との連携機能が大幅強化され、お手軽にJavaScriptのバンドルにフォントを埋め込むことができます。 Font Awesomeのアイコンを使う（バンドルする）には以下の3ステップを踏みます。 Font Awesome を npm でインストールして、 JavaScriptのコードで必要なアイコンだけを import して Font Awesomeの必要最小限が含まれるように w

概要 Google Apps Script (GAS)で、Web API(無料、サーバーレス)を公開する方法についてのメモです Google Apps Script (GAS)をローカルで開発したい、Gitでコード管理したい、クラスを使いたい、TypeScriptを使いたい、などのやり方も後半簡単に紹介します Google Apps Script (GAS) の位置づけを理解してみる Google Apps ScriptはG Suite(GmailやスプレッドシートなどGoogleサービス)を JavaScriptで制御できる仕組み。だから、Microsoft OfficeのVBAのGoogleサービス版みたいな感じ。 Google Apps ScriptはJavaScriptで書いた処理をWebAPIとして公開できるので、AWS LambdaとかGoogle Functionのようなサー

Jetty 9.4 をHTTPS (SSL/TLS) モードで実行する。Javaコードのみでの実現方法を詳解。Keytool、Servlet、クライアント証明書認証までハンズオンJavaSSLjettyHTTPSSpringBoot 概要 Javaの軽量Web APサーバーであるJetty9 をつかってHTTPS(SSL/TLS)サーバーを作る最小コードを掲載します。 Jetty関連の外部設定ファイル不要、コードのみで起動できます。 実験用にオレオレ証明書をつくります。OpenSSL等の外部ソフトウェアは不要です。JDK環境だけでOKです。 他のカスタマイズ例も掲載します Step1.Jettyの仕組み（コネクション、ハンドラの概念あたりを中心に）おさらい Step2.HTTPとHTTPSを両方ともホストする方法の最小コード Step3.HTTPでアクセスがあったら、自動的にHTTPSにリ

概要 今風の手法でJavaScriptアプリを作ろうとすると色々ツールがあって便利な反面、複雑でわからないことがたくさんあります。 わからないことがあったら、それを放置せず、しっかり理解して大いに寄り道しつつブラウザで動作するJavaScriptアプリをゼロから作っていきます ブラウザ上で動作するフロントエンドアプリを作ったら、ライブラリ化してnpmモジュールとして公開します 対象読者＝今風のJavaScript開発の入門者、初心者 11年前からタイムトラベルしてきたひと ブラウザ用アプリを作りたいが今風の手法の初心者(jQueryだけでなんとか生きてきた人とか） Node.jsの環境をつかってフロンドエンドアプリかいているけど、「何となく」理解している人 来年の新人教育係 キーワード 本投稿では、以下のようなキーワードが出てきます。 Node.js、npm、ES6(ECMAScript6

概要 Webpack 4を利用した開発に便利な webpack-dev-server の設定メモです。 webpack-dev-serverのソースコードと公式wiki、公式Docを参考に実動確認した結果を書きます。 HMR等オートリロード系の設定(--hotとかとか--inlineとか)やよく使いそうなCLIオプションなど理解しておくためのメモです。 環境 本投稿で使っている環境は以下の通り。 webpack-dev-server:3.1.7 webpack:4.17.1 webpack-cli:3.1.0 webpack-dev-server とは webpack-dev-serverはwebpackを用いたフロントエンド開発のときに利用できる開発用のwebサーバー。 *.jsファイルやリソースファイルを更新すると即座に反映してくれる機能をもっている。 webpack-dev-serv

Deleted articles cannot be recovered. Draft of this article would be also deleted. Are you sure you want to delete this article?

いまからはじめるJavaでAWS Lambda(ラムダ) AWS Lambda関数をJava8で記述し、AWS上 Lambda Functionとしてアップロードし、それをJavaクライアントから呼び出す例をステップ・バイ・ステップで紹介します。 想定読者 Javaが書けて、はじめてAWS Lambdaをつかう人 いままではnode.jsでLambda関数を作っていたが、わけあってJavaでつくってみようとおもう人（＝私のような） 記事構成 TL;DR 前編・後編で書きます 【前編】 JavaでLambda関数(クラウド側）と、クライアント(ローカル側）をお手軽に作る←本稿 【後編】 Lambda関数（クラウド側）の同期型、非同期型の呼び出しタイプ(Invocation Type)と、Javaクライアント側の同期、非同期呼び出し、API Gatewayでの公開 AWS Lambda(ラムダ