HN Rilis: Haystack – IDE untuk menjelajah dan mengedit kode di kanvas tanpa batas

 (haystackeditor.com)
2 poin oleh GN⁺ 2024-07-26 | 1 komentar | Bagikan ke WhatsApp
  • Haystack diperkenalkan sebagai alat code review yang membaca riwayat percakapan dan perubahan dalam PR secara bersamaan, lalu meneruskan hanya perubahan yang benar-benar membutuhkan penilaian manusia kepada reviewer
  • PR yang bersih digabungkan otomatis, sementara PR berisiko diklasifikasikan sebagai target seleksi, dengan tujuan alur yang mendekati “human code review time to zero”
  • Contoh PR memparalelkan tenancyInit() dan cacheWarmup() dengan Promise.all(), sehingga mengurangi cold start dari sekitar 4 detik menjadi 2,4 detik, tetapi membalik keputusan urutan eksekusi sebelumnya
  • Haystack menemukan dasar dari riwayat percakapan bahwa cacheWarmup harus dijalankan setelah tenancyInit, dan mengonfirmasi di sandbox bahwa terjadi crash 31 kali dari 50 kali boot
  • PR yang bermasalah diteruskan kepada @maya, yang menetapkan urutan awal, dan keputusan desain yang rusak serta hasil kegagalan dilampirkan ke PR untuk mengurangi waktu penilaian review

Alur seleksi otomatis untuk review PR

  • Haystack membaca riwayat percakapan dan perubahan dari semua PR, lalu menilai risikonya
  • PR berisiko dijalankan dan diverifikasi secara end-to-end, dan reviewer hanya dilibatkan saat penilaian manusia diperlukan
  • Layar menampilkan Haystack sedang menyeleksi 16 PR
    • PR dari berbagai bahasa seperti TypeScript, JavaScript, C, Python, Ruby, Go, dan C++ ditampilkan
    • Setiap PR ditandai dengan status analyzing

Contoh perubahan berisiko: memparalelkan bootstrap layanan

  • Contoh PR platform#3120 feat: parallelize service bootstrap adalah perubahan yang memparalelkan tahap bootstrap layanan
  • Kode lama menjalankan tenancyInit() terlebih dahulu, lalu menjalankan cacheWarmup() secara berurutan
  • Kode yang diubah menjalankan kedua tugas secara bersamaan dengan Promise.all([tenancyInit(), cacheWarmup()])
  • Menurut deskripsi PR, cold start sempat meningkat hingga sekitar 4 detik, dan setelah paralelisasi turun menjadi sekitar 2,4 detik
  • Semua pengujian yang ada lulus, sehingga dari luar terlihat seperti peningkatan performa yang mudah disetujui

Keputusan desain yang terungkap dari riwayat percakapan

  • Haystack membaca riwayat di balik PR dan menemukan bahwa perubahan tersebut membalik keputusan desain sebelumnya
  • @maya pernah meminta agar tenancyInit harus selesai terlebih dahulu supaya cacheWarmup tidak membaca konfigurasi kosong
  • Test suite tidak memiliki item yang memverifikasi urutan eksekusi ini, sehingga regresi tetap lolos pengujian
  • Review Haystack melampirkan informasi berikut ke PR
    • Keputusan yang tersimpan dalam riwayat percakapan
    • Perilaku yang benar-benar diubah oleh PR saat ini
    • Alasan pengujian tetap lulus

Verifikasi eksekusi dan hasil kegagalan

  • Haystack tidak berhenti pada membaca kode, tetapi menjalankan perubahan secara langsung
  • Ketika riwayat percakapan menunjukkan race condition terkait timing yang tidak ada dalam pengujian, Haystack melakukan boot layanan 50 kali di sandbox
  • Dalam 31 dari 50 kali, cacheWarmup membaca konfigurasi kosong sebelum tenancyInit selesai
  • Akibatnya layanan melempar exception pada request pertama dan crash
  • Haystack QA menampilkan alasan eksekusi, pengujian yang dilakukan, dan titik yang rusak bersama-sama di PR

Titik yang membutuhkan review manusia

  • Haystack tidak menggabungkan PR tersebut secara otomatis, dan merekomendasikan untuk melibatkan @maya, yang menetapkan urutan eksekusi awal
  • Keputusan desain yang rusak dan hasil boot yang gagal ditampilkan bersama di PR
  • Layar review menyediakan pilihan seperti “Request review”, “Chat with @maya”, dan “Doesn’t need review”
  • Alur Haystack berfokus pada menggabungkan sebagian besar PR secara otomatis, dan meneruskan hanya perubahan berisiko seperti contoh ini kepada orang yang tepat

Bacaan terkait

1 komentar

 
GN⁺ 2024-07-26
Opini Hacker News

  • Saya kurang tahu soal fitur AI-nya, tetapi konsep bekerja dengan kode di atas kanvas dan memakai UI diagram alur bersamaan adalah sesuatu yang sudah lama saya inginkan.
    Saya terutama mengerjakan pemrosesan data, dan sering menggambar diagram alur untuk menjelaskan pipeline atau memahaminya sendiri.
    UI pengembangan dengan arah seperti ini sepertinya bagus untuk menangani codebase yang sulit dikelola yang dibuat oleh orang-orang yang bukan lulusan CS.

    • Apakah yang Anda bayangkan alat seperti LabView?
      https://www.ni.com/en/shop/labview.html
    • Apakah mirip dengan cara kerja BlueJ di Java?
    • Saya penasaran apakah masalah yang dihadapi lebih ke visualisasi aliran data, atau visualisasi alur kontrol.
    • Akan keren jika bisa membuat sketsa diagram dan kode bersama-sama di kanvas yang sama.
      Dokumentasi visual sepertinya akan jadi jauh lebih mudah.

  • Benar-benar keren. Saat berpindah ke metode atau deklarasi, saya suka karena yang ditampilkan bukan seluruh file di tab tambahan yang digulir ke posisi definisinya, melainkan hanya potongan kode yang relevan.
    Saya sering kehilangan posisi metode yang sedang saya baca karena harus membandingkan lokasi pemanggilan metode dengan definisinya, dan itu cukup menyebalkan.
    Saya suka bisa “menyematkan” metode di samping, lalu menelusurinya di tampilan yang disematkan tanpa tanpa sengaja menggulir seluruh file.
    Setelah mencoba sebentar, sayangnya terasa sangat berpusat pada mouse, dan ketika mengikuti metode di dalam metode lain, terlalu banyak jendela mengambang yang harus dikelola.
    Kalau ada panah atau garis untuk melacak jendela mana yang menjadi “induk”, sepertinya akan lebih mudah membuat semacam diagram alur.
    Secara pribadi ada beberapa hal yang terasa kurang, tetapi saya senang melihat cara berpikir lain di area ini dan berharap ini sukses.

    • Saya paham kenapa Anda menyukainya, tetapi menurut saya dalam jangka panjang efek bersihnya bisa saja negatif.
      Saya pikir ada manfaatnya jika kita cukup tahu apa berada di mana dalam kode.
      Bisa saja seseorang mengerjakan satu proyek selama bertahun-tahun, tetapi karena hanya bekerja dengan potongan-potongan kecil, akhirnya tidak tahu file-file itu sebenarnya melakukan apa.
    • Pemrograman literat menerapkan ini dalam satu dimensi, yaitu dengan pengguliran vertikal, dan menyediakan dua tampilan.
      Ada kode sumber asli yang bercampur komentar dan teks, serta kode yang ditata rapi dengan teks berformat dan hyperlink untuk navigasi.
      http://literateprogramming.com/
    • Betul, perlu ada upaya untuk membuat navigasi dengan keyboard lebih mudah.
      Saya penasaran apa yang Anda bayangkan sebagai titik acuan untuk “jendela induk”.
      Apakah Anda ingin menunjuk jendela tertentu sebagai anchor, atau ingin semacam heuristik menemukan anchor seperti itu?

  • Selamat atas peluncurannya. Belakangan ini saya justru bergerak ke arah yang sepenuhnya berlawanan; karena masalah fokus dan kecenderungan ADHD, ini membantu mengurangi perasaan kewalahan karena melompat ke sana kemari.
    Satu jendela, minimalkan semuanya, dan yang paling penting, hilangkan penelusuran pohon.
    Jika harus berpindah ke file, saya memakai menu recent items di Intellij atau melompat dengan file marker.
    Artinya saya harus mengingat file marker dan memang berniat pergi ke sana. Untuk shortcut vim, saya memakai plugin IdeaVim.
    Bagi saya, cara ini membuat pemrograman jauh lebih fokus dan menyenangkan.
    Ini bagian dari perubahan dari multiscreen ke widescreen, lalu kembali lagi ke satu layar.
    Untuk codebase besar dan matang seperti yang disebutkan, saya memakai LLM sebagai pemandu.

    • Bagaimana cara memakainya? Saya juga penasaran sejauh apa yang Anda anggap sebagai codebase besar dan matang.
      Dalam pengalaman saya, LLM membuat cukup banyak kesalahan dan asumsi bahkan hanya dengan satu file.
    • Saya mengerti. Saya penasaran bagaimana Anda memakai LLM sebagai pemandu.
      Dalam pengalaman saya, ketika bertanya kepada LLM di mana alur suatu fitur berada, ia bisa membuat titik masuk dengan baik, tetapi detailnya sering harus saya pahami sendiri, dan kadang menunjuk ke tempat yang terkait tetapi bukan yang saya cari.

  • Menarik. Ada beberapa catatan.
    Obsidian punya fitur serupa bernama “Canvas”, jadi alur kerja itu layak dijadikan referensi.
    Bagi saya, ini tidak berguna sebagai alat mandiri; saya membutuhkannya sebagai plugin Idea.
    Bagian membuat layout adalah yang paling tidak saya sukai. Akan bagus jika ada AI yang menerima patch Git atau perbaikan bug lalu membuat layout yang sesuai.
    Berbagi layout harus sangat mudah.
    Akan bagus jika riwayat Git diintegrasikan sebagai dimensi lain. Akan bagus juga jika diff dan anotasi blame masuk ke dalam editor.
    Ada data yang bisa dipakai untuk pelatihan AI, yaitu commit Git.
    Akan bagus jika debugging juga diintegrasikan sebagai dimensi lain, dan data profiler juga diintegrasikan.

    • Dari video demo, tampaknya ini berjalan di dalam VSCode, bukan sebagai aplikasi mandiri.
      Jadi apa yang tersedia di sana bisa didapat apa adanya.
      Jika memakai alat keluarga Idea, saat ini tampaknya belum ada cara.
    • Alatnya terlihat bagus dan saya ingin mencobanya untuk pekerjaan. Karena saya memakai Android/Kotlin, saya juga mendukung integrasi IDEA.

  • Saya sudah lama ingin mencoba hal seperti ini. Apakah ada cara untuk mendapatkan pembaruan?
    Khususnya, meski hanya saat pertama kali mencobanya, saya menunggu opsi untuk mematikan fitur AI
    Saya terutama suka fitur memperbesar ke dalam sebuah fungsi lalu menyembunyikan sisa file. Ternyata cukup sering ada momen ketika saya menginginkan hal seperti ini
    Sepertinya ini juga bisa dipakai untuk dengan mudah menyeret fungsi-fungsi yang sedang dikerjakan dalam satu file ke samping, seperti menata ulang satu file secara virtual
    Selain antarmuka penyuntingan, menurut saya ada banyak peluang visualisasi di dalam editor
    Interaksi antara kode saya dan dependensi pihak ketiga, dependensi/graf panggilan kode saya atau sebagian darinya, graf dependensi di level kelas atau modul, serta graf panggilan bertingkat dengan drill-down ke graf panggilan internal objek semuanya memungkinkan
    Dalam semua kasus seperti ini, kemampuan berpindah mulus antara visualisasi dan penyuntingan adalah fitur killer yang tampaknya menjadi arah alat ini
    Dengan memasukkan grafik saja ke dalam editor, lebih banyak visualisasi menarik bisa dibuat, seperti heatmap frekuensi perubahan kode, heatmap performa kode, pelacakan penggunaan variabel, dan sebagainya
    https://adamtornhill.com/articles/crimescene/codeascrimescen...
    Terakhir, kalau belum membaca The Programmer's Brain, ada baiknya setidaknya mendengarkan podcast ini
    https://se-radio.net/2021/06/episode-462-felienne-on-the-pro...
    Ada banyak ide editor yang berkaitan dengan cara kerja otak kita, tetapi saya belum melihatnya didukung dengan baik di editor
    Karena sudah mengambil satu langkah ke arah itu, mungkin ada lebih banyak peluang lagi

    • Sayangnya kami belum membuat cara yang cerdik untuk berlangganan pembaruan
      Kami akan memikirkan cara terbaik, dan pada akhirnya akan mendorong pembaruan langsung dari dalam produk
      Saat ini kami baru saja menambahkan opt-out copilot
      Ide-ide di sini bagus, dan ada beberapa yang ingin kami diskusikan bersama. Kalau tidak keberatan, saya akan mengirim email/DM
      Secara umum kami ingin berbicara dengan banyak orang, dan kami bisa menerima masukan di feedback@haystackeditor.com

  • Saya benar-benar suka cara navigasinya dari fungsi ke fungsi, dari file ke file, lalu kembali lagi
    Agar lebih berguna, akan bagus jika ada panel riwayat navigasi seperti riwayat kunjungan browser
    Saat berpindah di antara file dan fungsi, panel itu menampilkan daftar, sehingga kita bisa maju-mundur atau langsung melompat ke posisi mana pun dalam riwayat navigasi tanpa harus susah payah mencari di antara jendela yang terbuka
    Riwayat navigasi yang saya maksud di sini sepenuhnya terpisah dari riwayat penyuntingan
    Undo/redo penyuntingan tidak boleh menggerakkan riwayat navigasi maju-mundur, begitu juga sebaliknya
    Tentu saja bisa ada pintasan keyboard untuk bergerak di riwayat navigasi

    • Ide bagus. Kami akan memikirkan cara terbaik untuk mengimplementasikannya

  • Keren. Ada kaitannya dengan Code Bubbles: https://dl.acm.org/doi/abs/10.1145/1753326.1753706

    • Benar, Bubbles memang bagus. Saya terutama suka konsep minimap-nya

  • “Kami tidak menyimpan kode atau mencatatnya ke log. Kami mengirim potongan kode ke Open AI sebagai input untuk copilot navigasi. Kami akan segera menambahkan opsi untuk menonaktifkan ini.”
    Kalau opsi itu sudah masuk, saya ingin mencobanya

    • Di Mac, kami sudah menambahkan opt-out copilot navigasi
      Buka command palette (CMD+SHIFT+P) lalu gunakan perintah “Opt out of navigational copilot”
      Windows/Linux juga akan segera didukung
      Perlu dicatat juga bahwa data hanya dikirim ke Open AI ketika ada diagnostik yang menyatakan pemanggilan fungsi yang tidak ada
    • Reaksi saya sama. Saya bersedia mendukung pengembangan alat seperti ini, tetapi saya lebih suka cara yang lebih langsung
    • Setuju. Seharusnya dari awal opt-in
    • Dengan kondisi saat ini, sepertinya sulit untuk mencobanya di perusahaan

  • Saya menerbitkan makalah tentang perbandingan waktu navigasi antara editor berbasis kanvas (Code Bubbles), editor tradisional berbasis tab (Eclipse), dan editor berbasis carousel yang saya rancang (Patchworks)
    Hasilnya, kanvas memberikan terlalu banyak kebebasan
    https://austinhenley.com/pubs/Henley2014CHI_Patchworks.pdf

    • Menarik. Saya belum banyak memikirkan tata letak spasial IDE secara mendalam
      Kalau dipikir-pikir, di VS Code pun saya tidak lagi memakai tab. Karena terlalu banyak file yang terbuka
      Saya hanya melihat satu file pada satu waktu, dan saat perlu berpindah, saya mencari dengan Cmd-P atau berpindah di antara file terbaru
      Ini berjalan baik, tetapi saya harus selalu menyimpan nama file/direktori di kepala
    • Saya baru membaca sedikit makalahnya, tetapi melihat pembahasan tentang Eclipse, sepertinya para peserta akan jauh lebih efisien jika mereka memakainya seperti IDE, bukan seperti editor multi-tab
      Mencari metode mungkin akan jauh lebih tidak menjadi masalah jika ada outline view yang diurutkan alfabetis
    • Sangat menarik. Kami sempat bimbang antara grid dan kanvas, tetapi akhirnya memilih kanvas karena secara praktis kami pikir navigasinya lebih mudah
      Kalau tidak keberatan, saya ingin berbincang, dan akan mengirim email
    • Menarik. Patchworks agak mirip dengan cara saya mengonfigurasi Doom Emacs
      Saya menaruh 4–6 panel kode di beberapa workspace, lalu berpindah dengan SPC TAB angka
    • Analisis yang luar biasa. Bagi saya, baik berbasis kanvas maupun carousel, keduanya mengurangi beban harus selalu memuat cukup banyak data kognitif di kepala saat menangani codebase yang sangat besar
      Untuk menggunakan alat ini dengan benar, widescreen yang memadai pada dasarnya juga diperlukan
      Intinya adalah membiasakan diri menangani file secara horizontal, bukan vertikal
      Cara berpikir vertikal ini cukup dalam berakar pada cara kita menulis Hello World pertama kali

  • Selamat atas peluncurannya. Ini terlihat seperti tool yang bagus dan diimplementasikan dengan baik, dan saya menantikan untuk mencobanya.
    Ini mengingatkan saya pada fitur yang sudah lama saya inginkan dan beberapa kali pernah saya buat secara manual, tetapi belum pernah berhasil saya jadikan bentuk yang bisa dibagikan. Yaitu fitur yang mengurai jalur kode menjadi satu skrip atau file sumber.
    Saya berharap bisa memasang sesuatu seperti breakpoint, menekan tombol “unravel”, lalu mendapatkan satu file yang menunjukkan semua hal yang terjadi sampai titik itu.
    Idealnya, akan lebih baik lagi jika file itu bisa dijalankan sebagai satu skrip.
    Pada dasarnya ini sama seperti tampilan yang disediakan debugger langkah demi langkah, tetapi alih-alih merujuk ke banyak file dan banyak lapisan, saya ingin melihat semuanya dari awal sampai akhir di dalam satu file.

    • Mengapa Anda membutuhkannya? Masalah apa yang ingin Anda selesaikan? Hasil seperti apa yang Anda inginkan?
      Menurut saya, ketika orang berfokus pada detail implementasi yang spesifik alih-alih persyaratan, parameter, dan hasil, banyak hal hilang dalam proses penyampaian.
      Saya penasaran mengapa Anda menginginkan implementasi ini, serta fungsi atau tujuan apa yang harus dipenuhi.