JavaScript

[Cocoon]「pinit_main.js」を削除するには?(Pinterest) SNS

[Cocoon]「pinit_main.js」を削除するには?(Pinterest)

Lighthouse Treemapで読み込まれている JavaScriptを見ていると、「」というコードが目に留まりました。これは、Pinterestでシェアするため画像選択処理を記述したスクリプトです。CocoonのSNSシェアの Pinterestが有効だと、フッターに「」の読込みが挿入されていました。 <?php //Pinterestシェアボタン用のスクリプト if (is_singular() && (is_top_pinterest_share_button_v...
「カスタム検索(サイト内検索)」スクリプトを除外した(cse.google.com/cse.js) とりあえずのメモ

「カスタム検索(サイト内検索)」スクリプトを除外した(cse.google.com/cse.js)

カスタム検索のスクリプト(cse.google.com/cse.js)が重そうです。asyncによる遅延読込みを試しましたが、あまり効果がありませんでした。結局、カスタム検索ボックスをトップページに載せるのではなく、別ページに分けてリンクを設置することにしました。遅延読込みのdeferとasyncまずは、スクリプトの読込みを遅延させることを考えました。<div class="gcse-searchbox-only"></div><script defer src=""></s...
[PHP] 不要なCSS/JavaScriptを無効化する(wp_dequeue_style, wp_dequeue_script) とりあえずのメモ

[PHP] 不要なCSS/JavaScriptを無効化する(wp_dequeue_style, wp_dequeue_script)

トップページで読み込まれているスタイル・スクリプトの中から、不要なものを削減しました。項目変更前CSS/JS減パフォーマンス7071使用していないJavaScriptの削減0.40s0.60s使用していないVSSの削減0.35s0.45sスクリプトサイズ0.77MB0.69MB不要なスタイル・スクリプトを見つける前回は、不要なプラグインを無効化しました。今回は不要なスタイル・スクリプトを削除していきます。前回はこちら。スタイル・スクリプトを一覧するショートコードは、過去に作っ...
[JavaScript] showOpenFilePickerがエラーになる(Uncaught (in promise) DOMException) とりあえずのメモ

[JavaScript] showOpenFilePickerがエラーになる(Uncaught (in promise) DOMException)

ファイル読み取りのため、以下のコードをそのまま実行したら動きませんでした。 const pickerOpts = { types: [{ description: 'Texts(.txt)', accept: {'text/*': ['.txt']} }], multiple: false, } let fileHandle; [fileHandle] = await window.showOpenFilePicker(pickerOpts); const file = aw...
[phina.js] JavaScript でユーザー端末のファイル入出力をするには とりあえずのメモ

[phina.js] JavaScript でユーザー端末のファイル入出力をするには

JavaScriptでは、ウェブ上のデータと違ってユーザー端末内のファイルには、直接アクセスできない仕組みになっています。これは、自分で作ったプログラムを検証する場合でもそうです。そのため、ローカル環境のファイルにアクセスするには、自前のウェブサーバでアクセス可能にするか、ブラウザから読み込み・保存する必要があります。今回は、ブラウザからのファイル入出力を見てみます。Blobオブジェクトのダウンロード文字列をテキストファイルとして保存するなら、仮想的なリンクを作って、リンクの...
[phina.js] ゲーム内で表示できるオブジェクトの基本 とりあえずのメモ

[phina.js] ゲーム内で表示できるオブジェクトの基本

前回は phina.js の土台となるシーン構成を概観しました。今回は シーンの要素となる基本的なオブジェクトをざっと見ていきます。参考資料は、「phina.js Tips集 上巻」です。ゲーム内で表示するオブジェクト前回の各サンプルで使われていたオブジェクトは・Label テキストを配置・Sprite 画像を配置・Button テキストと枠を配置でした。シンプルな項目なら、そのまま生成して配置します。 var label = Label('Hello, phina.js!'...
[phina.js] シーン管理の基本 とりあえずのメモ

[phina.js] シーン管理の基本

phina.jsのシーン遷移については、「<シーン編>|phina.js Tips集 下巻」が詳しいです。特徴的な部分をまとめます。phina.jsでは暗黙のうちにデフォルトのシーンが用意されているので、ちょっと戸惑いました。phina.jsの Hello Worldコード久しぶりに phina.js で遊んでみることにしました。JavaScriptだけでブラウザ上でゲームが動くのはやっぱり手軽です。しかし、プログラムの処理の流れをすっかり忘れています。まずは、シーンの概要と...
MRIやCTの画像ディスクをパソコンで見るには?【DICOMの閲覧】 Windows

MRIやCTの画像ディスクをパソコンで見るには?【DICOMの閲覧】

病院で画像診断のディスクをもらいました。パソコンに入れたところ、「このディスクに対して行う操作を選んでください」と表示されています。どうすればいいのでしょうか?Windows PCなら、同梱されている専用ビューワ「AOC Stackato」で画像データを閲覧できます。CD-ROMの自動再生「AOC_Stackato の起動」というのは、CD-ROM内の自動再生プログラムです。プログラムの表示を見ると、「専用ビューワ(AOC Stackato)」か「Webブラウザ」で画像診断デ...
【未解決】埋め込んだTwitterのフォントサイズを小さくしたい(けど、いったん断念)[WordPress] SNS

【未解決】埋め込んだTwitterのフォントサイズを小さくしたい(けど、いったん断念)[WordPress]

ただ、ツイートの埋め込みの文字サイズを本文に揃えたいだけなのに、めちゃくちゃ大変……。Twitterのツイートは、「ツイートを埋め込む」からコードを表示して、HTMLに埋め込むことができます。ところが、枠の幅や文字サイズなどは、ウェブサイトと異なるスタイルが適用されます。結論としては、あれこれ調べましたが、諦めました。「埋め込みツイート」が Twitterの仕様変更に依存しているので、サイト側で変更してもすぐに元に戻ってしまうからです。「twitter-tweet」のクラスを...
Electronでレンダラープロセスからメインプロセスに処理を渡して、また戻る【async/await】 ニッチな話題

Electronでレンダラープロセスからメインプロセスに処理を渡して、また戻る【async/await】

レンダラープロセスから、メインプロセスで処理を移した後、レンダラープロセスに処理を戻すには、どうすればよいかハマったのでメモをしておきます。結果としては、IPC通信とasync, awaitという非同期の関数を利用することで、解決しました。プロセス間通信と処理の流れやりたいことは、・UIの実行ボタンが押して、・端末のファイル操作を行い、・終わってからUIに貯めた入力データをクリアする、ということです。UIに関するデータは、レンダラープロセスにあります。ただ、node.jsの処...
[JavaScript]JQueryとdocument、どっちを使う?【HTML5】 インターネット小話

[JavaScript]JQueryとdocument、どっちを使う?【HTML5】

インターネットの情報の特徴として、新しい情報も過去の情報も混在しています。過去の情報を元にした新しい記事もあるため、「何が最新なのか」わかりにくい面があります。JavaScriptでウェブページの要素にアクセスしようと、インターネットで検索すると、「JQueryを使った方法」と「document」を使った方法が出てきます。そこで悩むのが、いったい どっちを使う方がよいのか、ということです。JQueryとgetElementBy〜例えば、idセレクタからDOM要素にアクセスする...
Electronでrequireができない?【プロセスとコンテクストとプリロードスクリプト】 ニッチな話題

Electronでrequireができない?【プロセスとコンテクストとプリロードスクリプト】

Electronでスクリプトを書いていたところ、Node.jsのAPIとDOM要素を結びつけるのに迷いました。main.jsではDOM要素にアクセスできず、HTMLから読み込んだスクリプト(renderer.js)ではNode.jsのAPIにアクセスできないからです。「プロセスモデル | Electron」をもとに、それぞれの役割の違いを見てみましょう。ポイントmain.jsは、メインプロセスを管理。renderer.jsは、レンダラープロセスを管理。preload.jsは、...
久しぶりにMacでElectronを使えるようにした【node.jsでアプリ自作】 ニッチな話題

久しぶりにMacでElectronを使えるようにした【node.jsでアプリ自作】

Macで動く自作ツールをJavaScriptでプログラムするために、Electronを使っていました。久しぶりにプログラムを修正しようとしたら、electronコマンドが通りません。改めて環境を構築しました。ポイントelectronのインストールで「sudo npm install -g electron --unsafe-perm=true --allow-root」でオプションを付加しないとエラーになったElectronが見つからないElectronは、「HTML5やJa...
ウェブページのスクリプトがマルウェアを「組み立てる」危険とは?【HTMLスマグリング】 インターネット小話

ウェブページのスクリプトがマルウェアを「組み立てる」危険とは?【HTMLスマグリング】

Microsoft Security Intelligenceによると、近年 「HTMLスマグリング(HTML Smuggling:HTMLの密輸)」というサイバー攻撃の手法が増えているそうです。「ウェブページのJavaScriptが、コンピュータ内にマルウェアを構築する」という話を見て、「ウェブページを見るだけで、マルウェアが保存されてしまうのか」と思ってびっくりしました。ただ、「見るだけで感染する」というわけではなさそうです。注意点は「フィッシング詐欺」と一緒。怪しいメー...
使用していないスクリプト・スタイルを減らしたい [PageSpeed Insights] インターネット小話

使用していないスクリプト・スタイルを減らしたい [PageSpeed Insights]

ブログのページを高速化したいけど、どこを削ったらよいかわからない💦とりあえず、「使用していないJavaScriptの削減」について、よくわからなかったことを、よくわからなかったなりにメモしておきます。PageSpeed Insightsの使用していないJavaScriptの削減PageSpeed Insightsをみると、「改善できる項目」に「使用していないJavaScriptの削減」があります。PageSpeed Insights項目の詳細をみると、Google Adsen...
どうして Windows XP でインターネットに接続できないの?【JWordプラグインが破損】(Let’s note CF-W7の場合) インターネット小話

どうして Windows XP でインターネットに接続できないの?【JWordプラグインが破損】(Let’s note CF-W7の場合)

家のパソコンをインターネットにつなごうとしたら、「プラグインが破損」というメッセージが表示されて進まないの。どうしてなのかな?よく、「古いパソコンはセキュリティの問題があって、インターネットにつないではいけない」と言われますが、なんか腑に落ちないですよね。今回は、Windows XP パソコンでインターネットに接続できなかった事例をもとに、実際にどんな問題点があるのか、みてみましょう。ポイントJWord プラグインは、サービス終了しているので、アンインストールする。Inter...
phina.jsで将棋盤ゲームのプログラミングした話 [JavaScript] ニッチな話題

phina.jsで将棋盤ゲームのプログラミングした話 [JavaScript]

先日、スマホで操作できる将棋盤プログラムを作りました。デザイン将棋盤↑ こちらから動かせます。phina.jsライブラリプログラミング言語は JavaScriptで、phina.jsというライブラリを利用しました。公式サイトHome | phina.jsせっかくなので、駒を自分でkeynoteでデザインしました。Keynoteで駒をデザインしたけっこう、図形の結合なんかを組み合わせるだけで、それっぽくできるんだね。すぐにコードを動かせるのが魅力言語にJavaScriptを選ん...
やっとLiteSpeed Cache 3.5.2がリリースされたので更新してみた 【Javascript読込みの最適化設定】 ニッチな話題

やっとLiteSpeed Cache 3.5.2がリリースされたので更新してみた 【Javascript読込みの最適化設定】

ここまでのあらすじを振り返ってみると、LiteSpeed Cache 3.5.0.1がリリースされたのが、2020年9月29日でした。その後、すぐに(2020年9月30日)JQueryの遅延読みで不具合が見つかり、LiteSpeed Cache 3.5.0.2として以前のバージョンにいったん戻されます。当初はすぐに修正される見通しでしたが、しばらく、そのままになっていました。最近ようやく動きがありましたので、メモしておきます。LiteSpeed Cacheの更新履歴を読んでみ...
LiteSpeed CacheがアップデートされてJQueryが遅延読込みされている 【ただしサイトスピードは高速化】 ニッチな話題

LiteSpeed CacheがアップデートされてJQueryが遅延読込みされている 【ただしサイトスピードは高速化】

ほとんどタイトルが全てなんですが、LiteSpeed Cacheプラグインのアップデートについてメモしておきます。プラグインのアップデート一つでこんなに変わるんですね。LiteSpeed Cacheのバージョンが3.5.0.1にアップグレードされたLiteSpeed CacheはWordPressのプラグインで、mixhostサーバーではサイトスピード向上のために利用することができます。最近(2020年9月29日)バージョンが3.4.2→から3.5にアップデートされました。そ...
遅延読込みでコードハイライトが機能しない【LiteSpeed  Cache】 ニッチな話題

遅延読込みでコードハイライトが機能しない【LiteSpeed Cache】

cocoonには「ソースコード設定」をしておいて「コードブロック」を挿入すると、コードをカラフルにハイライト表示する機能があります。なんか見た目にカラフルでいいですよね。cocoonでコードがハイライトしないところが何故かうまく表示されません。まずは、表示されたコードブロックを見てみてください。このように、コードブロックがあるのにjavascriptの色分けがされていません。まずはHTMLを検証してクラスを確認する検証でHTMLを見てみると、ちゃんとjavascriptのクラ...