Browser-Pwn

يُهيمن على عالم المتصفحات 4 لاعبون رئيسيون:

• Chromium/Chrome (محرك Blink)
• Firefox (محرك Gecko)
• Safari (محرك WebKit)
• Edge (محرك Blink (محرك EdgeHTML السابق)

ينقسم ما يلي إلى جزأين:

• معلومات تساعد على فهم بنيتها وتنفيذها وكيفية بنائها من المصادر
• معلومات تساعد في العثور على ميزة إظهار الآلة الحاسبة

فهرس المحتويات

1. المحركات
   • نظرة عامة
   • Chromium
   • Firefox
   • Safari
   • Edge
2. الاستغلال
   • نظرة عامة
   • Chromium
   • Firefox
   • Safari
   • Edge
3. الأدوات
4. توثيق جافاسكربت

المحركات

نظرة عامة على المحركات

• أساسيات محرك الجافاسكربت: الجيد والسيئ والقبيح
• أساسيات محرك الجافاسكربت: الأشكال والذاكرة المؤقتة المضمّنة (Inline Caches)
• محركات الجافاسكربت - كيف تعمل أصلًا (فيديو)

تصفح المصادر

بالطبع يمكنك استخدام إعدادك المفضل لتصفح المصادر. ومع ذلك، فإن هذه المستودعات كبيرة نسبيًا وقد جربت عدة إعدادات مختلفة حتى وجدت ما يناسبني. لذا إذا لم يكن لديك إعداد جيد بالفعل، فإليك بعض تجاربي التي قد تساعدك:

• CTags (+Vim): تعمل بشكل جيد مع تتبع المرجعيات والاستدعاءات. إذا كنت معتادًا على التنقل في أشجار المصادر الكبيرة بهذا الإعداد البسيط، فقد يكون خيارًا جيدًا لك. الجانب السلبي بالطبع هو نقص الميزات التي تأتي بها معظم بيئات التطوير الكبيرة هذه الأيام.
• CLion: أستخدم منتجات JetBrains في الكثير من أنشطتي البرمجية، لكن CLion لم يعمل جيدًا معي، خاصةً فيما يتعلق بتتبع المرجعيات. بالطبع قد يكون ذلك بسبب مشكلات في الإعداد.
• Eclipse: لم أستخدمه منذ فترة، لكنه اتضح أنه خيار جيد. لسوء الحظ، يتطلب الكثير من الموارد لكي يتمكن المفهرس من معالجة الكود.
  • هنا وصف إعداد لمشروع Chromium، لكنه يعمل بطريقة مماثلة للمشاريع الأخرى أيضًا.
• ccls+VSCode هذا هو الخيار الأفضل بالنسبة لي حتى الآن. ccls سريع جدًا في فهرسة المستودعات ويعمل بشكل رائع مع VSCode. يمكنك أيضًا دمجه مع محررات وبيئات تطوير أخرى انظر https://github.com/MaskRay/ccls/wiki/Editor-Configuration

Chromium (Blink)

المشروع | GitHub

مقالات:

• ما هو Chromium؟ (DE)

محرك الجافاسكربت الخاص بـ Blink هو V8.

V8

المشروع | GitHub | المصدر | How2Build

البناء (Ubuntu 18.04):

$ git clone https://chromium.googlesource.com/chromium/tools/depot_tools.git
$ export PATH=$PATH:./depot_tools
$ gclient
$ mkdir ./v8 && cd ./v8
$ fetch v8 && cd v8
$ git pull
$ gclient sync
$ ./build/install-build-deps.sh
$ tools/dev/gm.py x64.release
$ out/x64.release/d8

خيارات مفيدة:

• --print-opt-code: الكود المُنشأ بواسطة المترجم المُحسِّن
• --print-byte-code: البايت كود المُنشأ بواسطة المفسِّر
• --trace-ic: أنواع الكائنات المختلفة التي يواجهها موقع الاستدعاء
• --trace-opt و--trace-deopt: توضح أي الدوال يتم تحسينها أو إلغاء تحسينها
• --trace-turbo: تتبعات TurboFan لعرضها في أداة التصور Turbolizer

مقالات:

• جولة في V8

مترجم JIT: TurboFan

التوثيق | المدونة

يوفر V8 أداة تصور لـ TurboFan تُسمى Turbolizer

مقالات:

• مقدمة إلى TurboFan

استخدام Turbolizer:

1. شغّل v8 مع --trace-turbo: d8 --trace-turbo foo.js
2. يُنشئ ملفات json مثل turbo-foo-0.json
3. انتقل إلى v8/tools/turbolizer وقم بالتثبيت باستخدام npm كما هو موضح في README.md
4. قم بتشغيل خادم للدليل مثل python -m SimpleHTTPServer 8000
5. تصفح localhost:8000 وافتح turbo-foo-0.json

Firefox (Gecko)

المشروع | GitHub

محرك الجافاسكربت الخاص بـ Gecko هو Spidermonkey.

Spidermonkey

المشروع | المصدر | How2Build

المصدر

• builtin

البناء (Ubuntu 18.04):

$ wget -O bootstrap.py https://hg.mozilla.org/mozilla-central/raw-file/default/python/mozboot/bin/bootstrap.py && python bootstrap.py
$ git clone https://github.com/mozilla/gecko-dev.git && cd gecko-dev
$ cd js/src
$ autoconf2.13

# This name should end with "_DBG.OBJ" to make the version control system ignore it.
$ mkdir build_DBG.OBJ
$ cd build_DBG.OBJ
$ ../configure --enable-debug --disable-optimize
# Use "mozmake" on Windows
$ make -j 6
$ js/src/js

مترجم JIT: IonMonkey

المشروع

يوفر Spidermonkey أداة تصور لـ IonMonkey تُسمى IonGraph

المصدر

• jit

Safari (Webkit)

المشروع | GitHub

محرك الجافاسكربت الخاص بـ WebKit هو JavaScriptCore (JSC).

JavaScriptCore

المشروع | الويكي | المصدر

مقالات:

• http://www.filpizlo.com/papers.html

المصدر

• Runtime: Source/JavaScriptCore/runtime

البناء (Ubuntu 18.04):

# sudo apt install libicu-dev python ruby bison flex cmake build-essential ninja-build git gperf
$ git clone git://git.webkit.org/WebKit.git && cd WebKit
$ Tools/gtk/install-dependencies
$ Tools/Scripts/build-webkit --jsc-only --debug
$ cd WebKitBuild/Release
$ LD_LIBRARY_PATH=./lib bin/jsc

مترجم JIT: LLInt+ Baseline JIT + DFG JIT + FTL JIT

يمتلك WebKit نظام مترجم JIT من 4 طبقات، يمثل المفاضلة بين تكلفة الأداء الإضافية وفائدة الأداء.

مقالات:

• مقدمة إلى تحسينات JIT لجافاسكربت WebKit
• تقديم مترجم B3 JIT

المصدر

• LLInt (المفسِّر منخفض المستوى)
• Baseline JIT
• DFG JIT (مخطط تدفق البيانات)
• FTL JIT (مترجم Just In Time الأسرع من الضوء)

Edge (Blink/EdgeHTML)

المشروع | GitHub

منذ أن تحول Edge إلى Blink ومشروع Chromium كمحرك عرض له، أصبح Edge يستخدم v8. في الأصل، كان لدى Edge محرك عرض خاص به يُدعى EdgeHTML، وكان يستخدم محرك الجافاسكربت ChakraCore.

ChakraCore