Beberapa waktu lalu, saya sempat mengunduh aplikasi yang namanya diffchecker karena penasaran. Ternyata aplikasinya cukup kekinian, dengan menggunakan format AppImage:

$ file 'Diffchecker+2.1.0.AppImage'
Diffchecker+2.1.0.AppImage: ELF 64-bit LSB executable, x86-64, version 1 (SYSV), dynamically linked, interpreter /lib64/ld-linux-x86-64.so.2, for GNU/Linux 2.6.18, BuildID[sha1]=79dcc4e55a61c293c5e19edbd8d65b202842579f, stripped

Agar bisa dijalankan, kita set dulu sebagai executable:

$ chmod +x Diffchecker+2.1.0.AppImage

Setelah membaca sedikit dokumentasi aplikasi dengan format AppImage versi baru, ternyata kita dapat menggunakan opsi --appimage-help untuk melihat apa saja parameter yang dapat digunakan:

$ ./Diffchecker+2.1.0.AppImage --appimage-help
AppImage options:

  --appimage-extract              Extract content from embedded filesystem image
  --appimage-help                 Print this help
  --appimage-mount                Mount embedded filesystem image and
                                  print mount point and wait for kill with Ctrl-C
  --appimage-offset               Print byte offset to start of
                                  embedded filesystem image
  --appimage-portable-home        Create a portable home folder to use as $HOME
  --appimage-portable-config      Create a portable config folder to use as $XDG_CONFIG_HOME
  --appimage-signature            Print digital signature embedded in AppImage
  --appimage-updateinfo[rmation]  Print update info embedded in AppImage
  --appimage-version              Print version of AppImageKit

Portable options:

  If you want the AppImage to use a portable $HOME or $XDG_CONFIG_HOME, you can
  use the --appimage-portable options or create the following directories manually:

  My.AppImage.home will be used as $HOME
  My.AppImage.config will be used as $XDG_CONFIG_HOME

Saatnya mengekstrak isi dari AppImage tersebut dengan perintah ini:

$ Diffchecker+2.1.0.AppImage --appimage-extract

Hasilnya akan disimpan pada sub direktori squashfs-root:

$ ls -Ggh squashfs-root
total 123M
-rwxr-xr-x. 1 7.9K Mar 16 18:05 AppRun
-rw-r--r--. 1 4.2K Mar 16 18:05 blink_image_resources_200_percent.pak
-rw-r--r--. 1   18 Mar 16 18:05 content_resources_200_percent.pak
-rw-r--r--. 1 7.2M Mar 16 18:05 content_shell.pak
-rwxr-xr-x. 1  78M Mar 16 18:05 diffchecker
-rw-r--r--. 1  260 Mar 16 18:05 diffchecker.desktop
lrwxrwxrwx. 1   54 Mar 16 18:05 diffchecker.png -> usr/share/icons/hicolor/1024x1024/apps/diffchecker.png
-rw-r--r--. 1 9.8M Mar 16 18:05 icudtl.dat
-rwxr-xr-x. 1 2.8M Mar 16 18:05 libffmpeg.so
-rwxr-xr-x. 1  22M Mar 16 18:05 libnode.so
-rw-r--r--. 1 1.1K Mar 16 18:05 LICENSE.electron.txt
-rw-r--r--. 1 1.9M Mar 16 18:05 LICENSES.chromium.html
drwx------. 2 4.0K Mar 16 18:05 locales
-rw-r--r--. 1 171K Mar 16 18:05 natives_blob.bin
drwx------. 2 4.0K Mar 16 18:05 resources
-rw-r--r--. 1 110K Mar 16 18:05 ui_resources_200_percent.pak
drwx------. 4 4.0K Mar 16 18:05 usr
-rw-r--r--. 1 1.7M Mar 16 18:05 v8_context_snapshot.bin
-rw-r--r--. 1  56K Mar 16 18:05 views_resources_200_percent.pak

Pindah ke sub direktori resources pada direktori squashfs-root:

$ cd squashfs-root/resources

Pada direktori tersebut terdapat 2 buah file dengan ekstensi .asar. Ada beberapa cara yang dapat dilakukan untuk mengekstrak file dengan tipe tersebut. Jika menggunakan sistem operasi Windows, maka dapat menginstall aplikasi 7zip dengan tambahan plugin/ekstensi Asar7z:

The Asar7z distribution package is an ordinary Zip archive that contains the
following three files:

* Asar.64.dll – the 64-bit version of the plugin
* Asar.32.dll – the 32-bit version of the plugin
* ReadMe.txt – the user instructions

To install the plugin into the 7-Zip installation folder, you need to create
the "Formats" subfolder. After that, copy Asar.64.dll or Asar.32.dll
(depending on your 7-Zip edition) to that subfolder. If you do that, each
time you launch 7-Zip, it will automatically find Asar7z and use it when
opening .asar files.

Terdapat juga modul pyasar untuk python, namun sepertinya tidak dikembangkan lagi sehingga pada saat dicoba pada tutorial ini, hasilnya gagal mengekstrak file .asar tersebut. Sebagai referensi, berikut ini adalah cara melakukan instalasi modul pyasar:

$ pip install pyasar

Dan cara menggunakannya seperti ini (sesuai dengan informasi pada halaman pypi pyasar):

from asar import AsarArchive

with AsarArchive.open('myasarfile.asar') as archive:
    archive.extract('/home/mydir')

Cara yang digunakan pada tutorial ini adalah menggunakan modul asar untuk node-js. Jika Anda menggunakan distro Fedora, dan belum terdapat node-js pada sistem Anda, maka cukup lakukan instalasi paket npm dan otomatis node-js akan diinstall juga.

$ sudo dnf install npm

Setelah proses instalasi tersebut selesai, lanjutkan dengan proses instalasi modul asar seperti ini:

$ npm install asar

Berikut ini adalah informasi yang muncul ketika menjalankan modul asar tersebut:

$ ./node_modules/asar/bin/asar.js
Usage: asar [options] [command]

Manipulate asar archive files

Options:
  -V, --version                         output the version number
  -h, --help                            output usage information

Commands:
  pack|p [options] <dir> <output>       create asar archive
  list|l [options] <archive>            list files of asar archive
  extract-file|ef <archive> <filename>  extract one file from archive
  extract|e <archive> <dest>            extract archive
  *

Berdasarkan informasi di atas, kita dapat mengekstrak isi dari arsip asar dengan menggunakan opsi extract atau e. Berikut ini adalah perintah yang digunakan untuk mengekstrak arsip app.asar ke direktori unpacked:

$ ./node_modules/asar/bin/asar.js e app.asar unpacked

Karena pada tutorial ini kita akan berhadapan dengan source code javascript yang telah dioptimisasi, maka sebaiknya lakukan instalasi modul python js-beautify untuk normalisasi format script javascript yang telah dioptimisasi tersebut. Cukup gunakan pip untuk melakukan instalasi:

# pip install js-beautify

Salah satu file yang menarik adalah index.js. Pada baris 27-30 dan khususnya baris ke-30 terdapat potongan kode ini:

let mainWindow;
let secondaryWindows = [];

let loggedInToPaidSubscription = false;

Dan masih pada file index.js baris 368-398:

if (!loggedInToPaidSubscription) {
  const choice = dialog.showMessageBox(this, {
    type: 'question',
    buttons: ['Tell me more', 'No Thanks'],
    title: 'Confirm',
    message: 'Thank you for using Diffchecker Desktop!',
    detail:
      'Please consider purchasing a subscription to Diffchecker Desktop. Your purchase will fund continued development on both this and the web application, and you will receive all those updates as we release them!',
  });
  if (choice === 0) {
    shell.openExternal('https://www.diffchecker.com/desktop');
  }
}

Cukup menarik. Namun, saya belum sempat melakukan eksplorasi lebih jauh mengenai cara kerja aplikasi tersebut (mungkin di lain waktu). Sekian jurnal singkat kali ini, semoga bermanfaat. Terima kasih kepada Tuhan Yang Maha Esa, dan Anda yang telah membaca jurnal ini.

Jaman sekarang js-js everywhere 😁, btw nice article bro

Bener om. Framework js bertebaran dimana-mana. Hadeeeh, bikin mumet.

masih enakan jaman assembly ya om, sintaknya pendek-pendek dan gampang didebug :D

wkwkwk, begitulah kira-kira om. saya aja sampai sekarang masih suka assembly, soalnya bisa lebih dekat dengan mesin.