HN पर लॉन्च: Haystack – अनंत कैनवास पर कोड एक्सप्लोर और एडिट करने वाला IDE

 (haystackeditor.com)
2 पॉइंट द्वारा GN⁺ 2024-07-26 | 1 टिप्पणियां | WhatsApp पर शेयर करें
  • Haystack को एक ऐसे code review टूल के रूप में पेश किया गया है जो PR की बातचीत का इतिहास और बदलाव साथ में पढ़कर, केवल वे बदलाव reviewer तक भेजता है जिनमें वास्तव में मानवीय निर्णय की ज़रूरत हो
  • साफ़ PR को यह अपने-आप merge करता है और जोखिम वाले PR को चयनित समीक्षा के लिए वर्गीकृत करता है, ताकि “human code review time to zero” के करीब एक workflow बनाया जा सके
  • उदाहरण PR में tenancyInit() और cacheWarmup() को Promise.all() से parallel किया गया, जिससे cold start लगभग 4 सेकंड से 2.4 सेकंड तक घटा, लेकिन अतीत में तय किया गया execution order उलट गया
  • Haystack ने बातचीत के इतिहास से यह आधार निकाला कि cacheWarmup को tenancyInit के बाद चलना चाहिए, और sandbox में 50 boot में 31 बार crash की पुष्टि की
  • समस्या वाले PR को मूल order तय करने वाले @maya तक भेजा जाता है, और PR पर टूटा हुआ design decision तथा failure result जोड़कर review decision में लगने वाला समय घटाया जाता है

PR review को अपने-आप चुनने वाला workflow

  • Haystack सभी PR का बातचीत का इतिहास और बदलाव पढ़कर जोखिम का आकलन करता है
  • जोखिम वाले PR को end-to-end चलाकर सत्यापित किया जाता है, और केवल तब reviewer को शामिल किया जाता है जब मानवीय निर्णय ज़रूरी हो
  • स्क्रीन पर Haystack को 16 PR छाँटते हुए दिखाया गया है
    • TypeScript, JavaScript, C, Python, Ruby, Go, C++ जैसी कई भाषाओं के PR सूचीबद्ध हैं
    • हर PR analyzing स्थिति में दिखता है

जोखिम भरे बदलाव का उदाहरण: service bootstrap का parallelization

  • उदाहरण PR platform#3120 feat: parallelize service bootstrap service bootstrap चरणों को parallel करने वाला बदलाव है
  • पहले का code tenancyInit() चलाने के बाद cacheWarmup() को क्रम से चलाता था
  • बदला हुआ code दोनों काम Promise.all([tenancyInit(), cacheWarmup()]) से एक साथ चलाता है
  • PR विवरण के अनुसार cold start लगभग 4 सेकंड तक बढ़ गया था, और parallelization के बाद यह लगभग 2.4 सेकंड तक घट गया
  • मौजूदा test सब pass हो जाते हैं, इसलिए ऊपर-ऊपर से यह आसानी से approve होने लायक performance improvement जैसा दिखता है

बातचीत के इतिहास में सामने आया design decision

  • Haystack ने PR के पीछे का इतिहास पढ़कर पता लगाया कि यह बदलाव पुराने design decision को पलट रहा है
  • @maya ने कहा था कि cacheWarmup खाली configuration न पढ़े, इसलिए tenancyInit पहले पूरा होना चाहिए
  • test suite में इस execution order की जाँच करने वाला कोई item नहीं था, इसलिए regression test pass कर गया
  • Haystack review PR पर ये जानकारी जोड़ता है
    • बातचीत के इतिहास में दर्ज decision
    • मौजूदा PR वास्तव में कौन-सा behavior बदल रहा है
    • test pass होने की वजह

execution verification और failure result

  • Haystack सिर्फ code पढ़कर नहीं रुकता, बल्कि बदलाव को सीधे चलाकर भी देखता है
  • जब बातचीत का इतिहास test में मौजूद न होने वाली timing race condition की ओर इशारा करता है, तो यह sandbox में service को 50 बार boot करता है
  • 50 में से 31 बार, cacheWarmup ने tenancyInit पूरा होने से पहले खाली configuration पढ़ ली
  • उसके परिणामस्वरूप service पहले request पर exception फेंकती है और crash हो जाती है
  • Haystack QA PR पर execution का कारण, चलाए गए test, और कहाँ failure हुआ, यह सब साथ में दिखाता है

जहाँ human review की ज़रूरत है

  • Haystack इस PR को auto-merge नहीं करता, बल्कि मूल execution order तय करने वाले @maya को शामिल करने की सिफारिश करता है
  • PR पर टूटा हुआ design decision और failed boot result साथ में दिखाए जाते हैं
  • review स्क्रीन “Request review”, “Chat with @maya”, “Doesn’t need review” जैसे विकल्प देती है
  • Haystack का workflow ज़्यादातर PR को auto-merge करने और उदाहरण जैसे जोखिम वाले बदलावों को सही व्यक्ति तक पहुँचाने पर केंद्रित है

संबंधित पढ़ाई

1 टिप्पणियां

 
GN⁺ 2024-07-26
Hacker News की राय

  • AI फीचर के बारे में तो पक्का नहीं, लेकिन कैनवास पर कोड पर काम करने और साथ में flowchart UI इस्तेमाल करने का कॉन्सेप्ट कुछ ऐसा है जिसकी लंबे समय से इच्छा थी
    मैं ज़्यादातर data processing करता हूँ, और pipelines को समझाने या खुद समझने के लिए अक्सर flowcharts बनाता हूँ
    इस तरह की development UI हो तो non-CS background वाले लोगों द्वारा बनाए गए मुश्किल codebases से निपटने में मदद मिल सकती है

    • क्या आपका मतलब LabView जैसे tools से है?
      https://www.ni.com/en/shop/labview.html
    • क्या यह Java में BlueJ के तरीके जैसा है?
    • उत्सुक हूँ कि आपके सामने जो समस्या है वह data flow को visualize करने की है, या control flow को visualize करने की
    • अगर उसी canvas में diagrams और code साथ-साथ sketch किए जा सकें तो शानदार होगा
      visual documentation काफी आसान हो जाएगी

  • वाकई शानदार। किसी method या declaration पर जाते समय पूरे file को definition वाली जगह तक scroll किए हुए secondary tab में खोलने के बजाय, सिर्फ relevant code snippets दिखाने वाली बात पसंद आई
    मुझे अक्सर method जहाँ call हो रहा है और उसकी definition की तुलना करनी पड़ती है, जिससे मैं जो method पढ़ रहा था वह हाथ से निकल जाता है; यह काफी frustrating है
    अच्छा है कि method को बगल में “pin” करके रखा जा सकता है, और pinned view में गलती से पूरी file scroll किए बिना उसे देख सकते हैं
    थोड़ी देर इस्तेमाल करने पर लगा कि अफसोस, यह बहुत mouse-centric था, और दूसरे method के अंदर वाले methods को follow करते-करते manage करने के लिए बहुत सारी floating windows हो गईं
    अगर arrows या lines हों जिनसे track किया जा सके कि कौन-सी window “parent” window है, तो एक तरह का flowchart बनाना आसान होगा
    निजी तौर पर कुछ कमियाँ लगीं, लेकिन इस क्षेत्र में अलग सोच देखना अच्छा है और उम्मीद है यह सफल हो

    • समझता हूँ कि यह क्यों पसंद आया, लेकिन लंबे समय में इसका net effect negative भी हो सकता है
      मेरे हिसाब से code में क्या कहाँ है, इसका कुछ अंदाज़ा होना फायदेमंद है
      हो सकता है कोई कई साल तक एक project पर काम करे, फिर भी सिर्फ छोटे-छोटे टुकड़े देखकर काम करने की वजह से यह न जाने कि files आखिर करती क्या हैं
    • literate programming इसे 1D में, यानी vertical scrolling तरीके से लागू करती है और दो views देती है
      comments और text के साथ मिला हुआ original code, और formatted text व navigation hyperlinks के साथ अच्छी तरह typeset किया हुआ code
      http://literateprogramming.com/
    • सही, keyboard से navigation को आसान बनाने पर काम करने की ज़रूरत है
      “parent window” के reference point के रूप में आप क्या सोच रहे हैं, यह जानना चाहूँगा
      क्या आप किसी खास window को anchor बनाना चाहते हैं, या चाहते हैं कि कोई heuristic ऐसा anchor ढूँढ दे?

  • launch के लिए बधाई। आजकल मैं बिल्कुल उल्टी दिशा में जा रहा हूँ, क्योंकि focus और ADHD tendencies के चलते इधर-उधर कूदते-कूदते overwhelmed होने को कम करने में यह मदद करता है
    एक window, सब कुछ minimize, और सबसे अहम बात: tree navigation हटाना
    अगर किसी file पर जाना हो तो Intellij का recent items menu इस्तेमाल करता हूँ या file markers पर jump करता हूँ
    इसका मतलब है कि file markers याद रखने पड़ते हैं और वहाँ जाने का इरादा होना चाहिए। vim shortcuts के लिए IdeaVim plugin इस्तेमाल कर रहा हूँ
    मेरे लिए यह तरीका programming को कहीं ज़्यादा focused और enjoyable बनाता है
    यह multiscreen से widescreen पर जाने और फिर वापस single screen पर लौटने वाले बदलाव का हिस्सा है
    जिन बड़े और mature codebases का आपने जिक्र किया है, उनमें मैं LLM को guide की तरह इस्तेमाल करता हूँ

    • आप इसे कैसे इस्तेमाल करते हैं? यह भी जानना चाहूँगा कि बड़े और mature codebase से आपका मतलब किस scale से है
      मेरे अनुभव में LLM एक file के साथ भी काफी गलतियाँ और assumptions कर देता है
    • समझता हूँ। curious हूँ कि आप LLM को guide की तरह कैसे इस्तेमाल करते हैं
      मेरे अनुभव में, जब LLM से पूछा कि किसी feature का flow कहाँ है, तो यह entry points तो ठीक बना देता है, लेकिन details अक्सर खुद ही समझनी पड़ती हैं, और कभी-कभी वह relevant लेकिन असल में खोजी जा रही जगह से अलग जगह दिखा देता है

  • दिलचस्प। कुछ notes हैं
    Obsidian में “Canvas” नाम का similar feature है, इसलिए उसके workflow को reference के तौर पर देखा जा सकता है
    मेरे लिए standalone tool के रूप में यह उपयोगी नहीं है; मुझे इसे Idea plugin के रूप में चाहिए
    layout बनाने वाला हिस्सा सबसे नापसंद है। अच्छा होगा अगर कोई AI Git patch या bug fix लेकर उसके हिसाब से layout बना दे
    layout sharing बहुत आसान होनी चाहिए
    Git history को एक और dimension की तरह integrate करना अच्छा होगा। editor के अंदर diff और blame annotations भी आ जाएँ तो अच्छा रहेगा
    AI training के लिए data उपलब्ध है, यानी Git commits
    debugging को भी एक और dimension के रूप में integrate करना चाहिए, और profiler data भी जोड़ना अच्छा होगा

    • demo video देखकर लगता है कि यह standalone नहीं, बल्कि VSCode के अंदर चलता है
      यानी वहाँ जो मिलता है, वह सब मिल जाता है
      अगर आप Idea family के tools इस्तेमाल करते हैं, तो फिलहाल कोई रास्ता नहीं दिखता
    • tool अच्छा लगता है और काम के लिए आज़माना चाहूँगा। Android/Kotlin होने की वजह से IDEA integration के पक्ष में मेरा भी एक vote

  • मैं बहुत पहले से ऐसी चीज़ आज़माना चाहता था। अपडेट्स पाने का कोई तरीका है क्या?
    खासकर पहली बार आज़माते समय भी AI फीचर बंद करने का विकल्प का इंतज़ार है
    किसी function के अंदर zoom करके बाकी file छिपा देने वाला feature खास तौर पर अच्छा है। हैरानी की बात है कि ऐसे कई मौके आए जब मुझे ऐसा कुछ चाहिए था
    एक ही file के अंदर जिन functions पर अभी काम कर रहा हूँ, उन्हें आसानी से बगल में खींचकर रख सकूँ—इस तरह एक single file को virtually rearrange करने के लिए भी इस्तेमाल किया जा सकता है
    editing interface के अलावा भी editor के अंदर visualization के कई मौके दिखते हैं
    मेरे code और third-party dependencies के interaction, मेरे code का dependency/call graph या उसका कोई हिस्सा, class या module-level dependency graph, और object के अंदर calls तक drill down करने वाले nested call graphs संभव हैं
    इन सभी मामलों में visualization और editing के बीच smooth तरीके से आ-जा पाना ही वह killer feature है जिसकी तरफ यह tool जाता दिखता है
    editor में graphics आ जाने भर से code change frequency heatmap, code performance heatmap, variable usage tracking जैसी और भी कई दिलचस्प visualizations संभव हो जाती हैं
    https://adamtornhill.com/articles/crimescene/codeascrimescen...
    अंत में, अगर आपने The Programmer's Brain नहीं पढ़ी है, तो कम से कम यह podcast सुनना अच्छा रहेगा
    https://se-radio.net/2021/06/episode-462-felienne-on-the-pro...
    हमारे दिमाग के काम करने के तरीके से जुड़े editing ideas बहुत हैं, लेकिन अभी तक editors में उनका अच्छा support नहीं देखा
    आप लोग पहले ही उस दिशा में एक कदम बढ़ा चुके हैं, इसलिए शायद और मौके भी हों

    • अफसोस, updates के लिए signup करने का कोई clever तरीका अभी नहीं बनाया है
      सबसे अच्छा तरीका सोचूँगा, और आखिरकार product के अंदर ही सीधे updates push करेंगे
      अभी-अभी copilot opt-out जोड़ रहा हूँ
      यहाँ के ideas अच्छे हैं, और उनमें से कुछ पर साथ में चर्चा करना चाहूँगा। अगर ठीक हो तो email/DM भेजूँगा
      कुल मिलाकर कई लोगों से बात करना चाहता हूँ, और feedback@haystackeditor.com पर feedback लिया जा सकता है

  • function से function, file से file, और फिर वापस जाने वाला navigation तरीका मुझे सच में पसंद आया
    इसे और उपयोगी बनाने के लिए browser history जैसा navigation history pane हो तो अच्छा होगा
    files और functions के बीच move करते समय list दिखे, और खुले हुए windows में मेहनत से खोजे बिना आगे-पीछे जा सकें या navigation history में किसी भी जगह सीधे jump कर सकें
    यहाँ navigation history से मतलब editing history से पूरी तरह अलग है
    edit undo/redo से navigation history आगे-पीछे नहीं होनी चाहिए, और इसका उलटा भी नहीं
    हाँ, navigation history में आने-जाने के लिए keyboard shortcuts हो सकते हैं

    • अच्छा idea है। इसे सबसे अच्छे तरीके से कैसे implement किया जाए, सोचूँगा

  • बढ़िया। Code Bubbles से संबंधित है: https://dl.acm.org/doi/abs/10.1145/1753326.1753706

    • सही, Bubbles शानदार है। खासकर minimap concept पसंद है

  • “हम code को store या log नहीं करते। navigation copilot के input के तौर पर code snippets Open AI को भेजते हैं। जल्द ही इसे disable करने का option जोड़ेंगे।”
    वह option आ जाए तो देखना चाहूँगा

    • Mac पर navigation copilot opt-out जोड़ दिया है
      command palette (CMD+SHIFT+P) खोलें और “Opt out of navigational copilot” command इस्तेमाल करें
      Windows/Linux support भी जल्द आने वाला है
      यह भी ध्यान दें कि data Open AI को केवल तब भेजा जाता है जब किसी non-existent function को call करने वाली diagnostic हो
    • मेरी भी वही प्रतिक्रिया थी। ऐसे tool के development को support करने की इच्छा है, लेकिन कोई ज्यादा direct तरीका बेहतर लगेगा
    • सहमत। शुरू से ही opt-in होना चाहिए था
    • मौजूदा हालत में इसे company में try करना मुश्किल होगा

  • canvas-based editor (Code Bubbles), पारंपरिक tab-based editor (Eclipse), और मेरे design किए carousel-based editor (Patchworks) की navigation time comparison पर paper निकाला था
    नतीजा मिला कि canvas में freedom बहुत ज्यादा होती है
    https://austinhenley.com/pubs/Henley2014CHI_Patchworks.pdf

    • दिलचस्प। IDE के spatial layout के बारे में मैंने ज्यादा गहराई से नहीं सोचा था
      पीछे मुड़कर देखूँ तो VS Code में भी अब tabs इस्तेमाल नहीं करता। खुले हुए files बहुत ज्यादा होते हैं
      बस एक समय में एक file देखता हूँ, और switch करना हो तो Cmd-P से search करता हूँ या recent files के बीच move करता हूँ
      यह ठीक काम करता है, लेकिन file/directory names हमेशा दिमाग में रखने पड़ते हैं
    • paper थोड़ा ही पढ़ा, लेकिन Eclipse वाली चर्चा देखकर लगता है कि अगर participants ने उसे multi-tab editor की तरह इस्तेमाल करने के बजाय IDE की तरह इस्तेमाल किया होता, तो वे कहीं ज्यादा efficient होते
      methods ढूँढना alphabetically sorted outline view होने पर बहुत कम problem लगता
    • सच में दिलचस्प। grid और canvas के बीच सोच रहा था, लेकिन असल में navigation ज्यादा आसान लगेगा ऐसा सोचकर canvas चुना
      अगर ठीक हो तो बात करना चाहूँगा, email भेजूँगा
    • दिलचस्प। Patchworks कुछ हद तक उस तरीके जैसा है जिससे मैं Doom Emacs configure करता हूँ
      कई workspaces में code panels 4–6 रखता हूँ, और SPC TAB number से switch करता हूँ
    • शानदार analysis है। मेरे लिए canvas-based हो या carousel-based, बड़े codebase के साथ काम करते समय दिमाग में काफी मात्रा में cognitive data loaded रखने का बोझ यह कम करता है
      tool को ठीक से इस्तेमाल करने के लिए पर्याप्त widescreen भी practically जरूरी है
      मुख्य बात files को vertical के बजाय horizontal direction में handle करने की आदत डालना है
      यह vertical thinking उस तरीके में काफी गहराई से जमी हुई है जिससे हमने पहली बार Hello World लिखा था

  • लॉन्च के लिए बधाई। यह एक शानदार और अच्छी तरह से implemented tool जैसा दिखता है, और इसे आज़माने का इंतज़ार है
    एक ऐसा feature याद आता है जिसे मैं लंबे समय से चाहता था और कुछ बार manually बनाने की कोशिश भी की थी, लेकिन shareable form में नहीं बना पाया था। यह code path को एक script या source file में खोलकर दिखाने वाला feature है
    अगर breakpoint जैसी कोई चीज़ set करके “unravel” button दबाएँ, तो अच्छा होगा कि एक single file बच जाए जो उस point तक होने वाली सारी actions दिखाए
    Ideally, अगर वह file single script की तरह executable हो तो और भी बेहतर होगा
    मूल रूप से यह step-by-step debugger द्वारा दिए जाने वाले view जैसा है, लेकिन कई files और कई layers को reference करने के बजाय मैं शुरुआत से अंत तक सब कुछ एक ही file में देखना चाहता हूँ

    • इसकी ज़रूरत क्यों है? आप कौन-सी समस्या हल करना चाहते हैं? desired outcome क्या है?
      मुझे लगता है कि जब लोग requirements, parameters और results के बजाय specific implementation details पर focus करते हैं, तो communication में बहुत कुछ खो जाता है
      मैं जानना चाहता हूँ कि आप यह implementation क्यों चाहते हैं, और इसे कौन-सा function या purpose पूरा करना चाहिए