הבלוג של ינון פרק

הסלוגן של אפל "יש אפליקציה לזה" מעביר מסר של קלילות ומהירות. יש לך בעיה? יש לנו אפליקציה שתפתור אותה. לחיצת כפתור והבעיה נעלמת. מה שלא מדברים עליו זה ההשפעה של אותה אפליקציה על הטלפון שלך, על חיי הסוללה, מידע שיאסף עליך, המקום שהאפליקציה והנתונים שלה תופסים (שאולי אחר כך ידחפו אותך לקנות את החשבון גיבוי בתשלום). אבל למי אכפת מהשלכות, יש אפליקציה לזה.

ואת אותו משחק אנחנו משחקים עם ספריות npm. צריכים לבדוק אם מספר זוגי? להוסיף אנימציה? להתחבר ל API? לתכנן זמנים? יש ספריה לזה. רק תפעילו

npm add moment

ולא תצטרכו לכתוב את הלוגיקה המסובכת לבד.

אבל בעולם האמיתי נרצה להשקיע קצת יותר זמן ותשומת לב בהוספה של ספריה חדשה לפרויקט, ונרצה להבין:

1. "כמה הספריה עולה" כלומר מה הגודל שהיא מוסיפה לגודל הבאנדל או כמה זמן היא מוסיפה לזמן טעינת העמוד?

2. מה האלטרנטיבות? איזה ספריות אחרות עושות עבודה דומה? למה החלטתי דווקא על הספריה הזו? לדוגמה ספריית day.js מציעה אלטרנטיבה קטנה בהרבה מ moment עם אותו API.

3. האם יש דרכים שונות להשתמש בספריה והאם אני בוחר את הדרך האופטימלית עבורי? לדוגמה הספריה motion מגיעה בגירסה מלאה וגירסת מיני, ואם אין לכם צורך בכל האנימציות תוכלו לקבל ביצועים הרבה יותר טובים בעבודה עם גירסת המיני.

4. האם הספריה מתוחזקת? מה הסיכוי שמישהו יכניס קוד זדוני לשרשרת האספקה שלה או לספריה עצמה, ודרך הקוד הזה יגיע אליי למערכת?

5. האם זו ספריה ש AI יודע לעבוד איתה נכון, או שאני אצטרך לעדכן את הפרומפטים ולבקש שיעבוד עם גירסה ספציפית או בצורת עבודה מסוימת איתה.

6. מה מדיניות התמיכה לאחור של מפתחי הספריה? האם בעוד שנה עדיין אוכל להשתמש בה או שכל שלושה חודשים אצטרך לעשות Refactor בשביל לשדרג גירסאות? זכורה לרעה כאן ריאקט ראוטר שכל חצי שנה יצאה בגירסה חדשה עם API שונה.

היום עם ה AI קל מאי פעם להגיע למידע. אתם רחוקים מרחק פרומפט אחד מקבלת תשובה מפורטת לכל השאלות ואפילו מיצירת מימוש קטן של אותו מנגנון מחוץ לספריה. בואו נהנה מזה ונשתמש במידע כדי לקבל החלטות טובות יותר.

ריאקט הגיעה עם תפיסה חדשנית לפיתוח ווב כתוצאה מבעיה במערכת ווב גדולה (המערכת של פייסבוק). האתגר שלהם היה שאירועים שונים יכולים להשפיע על "נראות" של אלמנטים על העמוד, ולכן היה קשה להבין את כל האופנים השונים בהם עמוד יכול להופיע. יותר מזה, לפעמים כמה מקומות בעמוד היו צריכים להציג שינוי בצורה מתואמת, למשל כשהגיעה הודעה חדשה היה צריך להציג אותה גם בפאנל ההודעות וגם לעדכן את המספר בפאנל העדכונים. כשמשתמש קורא הודעה במסך ההודעות יש למחוק את העדכון על הודעה חדשה מפאנל העדכונים. אבל בגלל שלא היה מקום אחד ששומר את המידע, כל אזור במסך שמר את המידע של עצמו, מידע נשמר בצורה כפולה וכך נוצרו באגים של סינכרון.

האתגר של פייסבוק אמיתי ועדיין משפיע על פיתוח מערכות רבות מבוססות ריאקט. כשמידע זהה נשמר בצורה כפולה בכמה מקומות שונים במערכת עלינו לסנכרן בין המקומות. קוד אירוע שפועל על המידע צריך "לזכור" לעדכן את המידע בכל המקומות הרלוונטים ופה קל לפספס ולהגיע לבאגים.

הפיתרון הריאקטי הוא פשוט וגאוני: נשמור את המידע רק במקום אחד. כל דבר שיכול להשתנות בעמוד יכול להשתנות בגלל "מידע" מסוים שמשפיע עליו, ולכל מידע יש רק בית אחד. מידע הוא סטייט וסטייט שייך לקומפוננטה. קומפוננטות אחרות מקבלות את המידע הזה דרך Props אבל לעולם לא ישמרו עותק אצלן. בצורה כזאת כשמידע מתעדכן העדכון משפיע על כל המקומות במסך שתלויים בו.

כל זה עובד טוב בספר הלימוד אבל בחיים האמיתיים יש בעיה שחוזרת כמעט בכל יישום ריאקט שנכתוב: סטייט נוטה לעלות למעלה לאזורים המשותפים יותר מהר ממה שהיינו רוצים.

ניקח דוגמה פשוטה של מונה לחיצות:

import { useState } from "react";

export default function Counter() {
  const [count, setCount] = useState(0);

  return (
    <div className="counter" >
      <p>Count = {count}</p>
      <button onClick={() => setCount(c => c + 1)}>+1</button>
    </div>
  )
}

ועכשיו נרצה לשים מספר מונים כאלה על המסך ומעליהם לכתוב מה הערך המקסימלי של מונה כלשהו מקבוצת המונים. נו, זה לא נשמע מסובך, אני מתחיל עם App:

import { useState } from 'react'
import reactLogo from './assets/react.svg'
import viteLogo from '/vite.svg'
import './App.css'
import Counter from './Counter'
import CounterGroup from './CounterGroup'
function App() {

  return (
    <CounterStatistics />
    <Counter />
    <Counter />
    <Counter />
  )
}

export default App

ואז מנסה לכתוב את CounterStatistics כדי להציג את המקסימום והמינימום - ופה פוגש את ריאקט ותיאוריית הסטייט שלו. כי בשביל ש CounterStatistics יוכל להשתמש במידע, כלומר בערכים שמופיעים במוני הלחיצות, אני צריך שהמידע הזה יעלה למעלה ויישמר בקומפוננטה משותפת, לא בתור משתנה בודד בתוך Counter אלא בתור מערך של מספרים. זאת הדרך הריאקטית קדימה:

function App() {
  const [counterValues, inc] = useCounters(3);
  return (
    <>
      <CountersStats values={counterValues} />      
      <Counter value={counterValues[0]} inc={inc(0)} />
      <Counter value={counterValues[1]} inc={inc(1)} />
      <Counter value={counterValues[2]} inc={inc(2)} />
    </>
  )
}

ועכשיו הייתי צריך לשנות את הקומפוננטה של Counter שלא תכיל סטייט פנימי רק בשביל לשים אותה בתוך קומפוננטה שתציג סטטיסטיקות.

וכן אני מבין מה קורה פה ולמה היינו צריכים ללכת את הדרך הזאת, אבל באמת יש פה שאלה אם זה שווה את המאמץ, ואולי דווקא במקרים כאלה כן שווה לשכפל את הסטייט ולשמור סטייט נפרד נוסף לסטטיסטיקות, כלומר:

function App() {
  const [min, setMin] = useState(0);
  const [max, setMax] = useState(0);

  function update(value) {
    setMin(Math.min(min, value));
    setMax(Math.max(max, value));
  }

  return (
    <>
      <CountersStats />
      <Counter onChange={update} />
      <Counter onChange={update} />
      <Counter onChange={update} />
    </>
  )
}

וכן גם פה צריך לשנות קצת את Counter ולהוסיף את onChange בתור מאפיין אופציונאלי אבל זה שינוי פחות משמעותי מלהעביר את הסטייט החוצה.

מה דעתכם?

התחלתי פרויקט צד חדש וההתלבטות הראשונה היתה בחירת טכנולוגיית צד לקוח. את צד השרת ידעתי שאני רוצה לכתוב בריילס כי פרויקט צד ואפשר להתפנק, אבל צד לקוח זה סיפור אחר. מצד אחד לריאקט יש אקוסיסטם מטורף עם קומפוננטה לכל דבר שצריכים ו AI שיכול לכתוב בעצמו את רוב הקוד של המערכת. מצד שני ראיתי מספיק מערכות ריאקט מסתבכות, סטייט מנוהל במקום הלא נכון, אפקטים שלא היו צריכים להיות שם ומלכודות רבות נוספות. כן כשעובדים בצוות וצריכים לסנכרן עבודה, לבנות רכיבים לשימוש חוזר ולוודא שהכל מתועד ובדוק ריאקט (או באופן כללי ספריית פיתוח צד-לקוח מבוססת קומפוננטות) נותנת הרבה ערך, אבל מה קורה בפרויקט צד שאני כותב לבד?

בסיכומה של התלבטות החלטתי להתחיל בלי ריאקט ולראות מה יקרה וכמה אתגעגע אליה. התוצאה היא JavaScript קצת מבולגן, ששומר את הסטייט ב DOM במקום בזיכרון וכולל לא מעט קטעי קוד מהסוג הזה:

if (this.miniPlayerValue) {
  this.playButtonTarget.textContent = '❚❚';
} else {
  this.playButtonTarget.classList.add('hidden');
}

ובאותו זמן עמוד שנטען הרבה יותר מהר כי מכיל הרבה פחות JavaScript (כ 360 קב), בלי שום צורך לחשוב על סטייט, איפה לשים אותו ואיך הוא עובד ומיסתנכרן בין מספר מקומות ביישום. בקיצור בינתיים אני עוד לא מתגעגע אבל זה כמובן רק פונקציה של דרישות המערכת. יום אחד אם יהיו דרישות מספיק מורכבות אולי יהיה מקום לשקול ריפקטורינג לפריימוורק.

הפרויקט עצמו אגב הוא מערכת שבונה לי אוטומטית תרגולי שפה מתוך שירים. אם אתם בעניין הנה כמה דוגמאות לתרגולים שבניתי עם JavaScript ונילה ללא ריאקט לפי השירים:

ספרדית עם השיר El principio de algo https://www.langlets.app/courses/el-principio-de-algo

צרפתית עם Et si tu n'existais pas https://www.langlets.app/lessons/et-si-tu-n-existais-pas0

אנגלית עם מיילי סירוס https://www.langlets.app/lessons/flowers0

וערבית עם ג'ואן ספדי https://www.langlets.app/lessons/haifa-jenin0

בואו ניקח את רשימת 10 החולשות מ OWASP של יישומי LLM כדי להבין האם ה AI חושף אותנו לבעיות אבטחה חדשות, או שאולי זו בסך הכל אותה גברת בשינוי אדרת ועלינו לגשת לאבטחת המידע עם אותה זהירות שהיתה לנו עד עכשיו. הנה הרשימה:

1. הזרקת פרומפט
2. חשיפת מידע רגיש
3. פגיעה בשרשרת האספקה
4. הרעלת מידע
5. שימוש בפלט מ LLM בלי לנקות אותו קודם
6. עודף הרשאות לסוכן
7. שימוש במידע סודי בפרומפט
8. הזרקת פרומפט במנועי RAG
9. ניצול לרעה של ההזיות
10. מניעת שירות באמצעות שאילתות שייתקעו את ה LLM או יבזבזו הרבה טוקנים.

רוב הפריטים פה אמורים להיראות לכם מאוד מוכרים!

הזרקת פרומפט היא גלגול חדש של הזרקת SQL והזרקת JavaScript (ולזקנים - ניצול Buffer Overflow לצורך הזרקת קוד). חשיפת מידע רגיש זה בדיוק המערכת שלא בודקת זהות לפני שמאפשרת גישה לנתיב פרטי. שרשראות האספקה הן תוהו ובוהו כבר יותר מדי שנים ומזמן למדנו שלפני ששולחים משהו לפקודת Shell צריך לנקות אותו.

הרבה זמן אנחנו מדברים על זה שבפיתוח מערכת כל רכיב צריך לקבל את ההרשאות המינימליות לביצוע רק את המשימות שלו ושמידע סודי צריך לשבת במקומות שמורים היטב. בעבודה עם LLM-ים עלינו להתיחס לקוד שקורא ל LLM בתור רכיב במערכת ולהגביל את ההרשאות שלו, בלי קשר לפלט שהוא יקבל מה LLM. הגבלה כזאת גם תציל אותנו משימוש לרעה בהזיות - אפילו אם התוקף יודע שלמודל יש נטייה להזות שם מסוים של ספריית JavaScript, הקוד שלנו צריך לוודא לפני שטוען את הספריה (שה LLM המליץ) שהספריה באמת קיימת ואינה זדונית.

עם כל החוכמה של הבינה המלאכותית, בנושא אבטחת מידע אין הרבה חדש תחת השמש. לא סומכים על אף אחד ובמיוחד לא על LLM.

מתחילים לפתח סוכן AI ולא בא לכם לשלם מהטוקן הראשון? גיטהאב תשמח לעזור. הנה מה שעושים:

1. נכנסים לגיטהאב ומייצרים לעצמכם טוקן גישה חדש עם גישה ל Models (זה נקרא גישת קריאה וזה מספיק) - זה הלינק:

https://github.com/settings/tokens

1. בוחרים מודל שמעניין אתכם מרשימת המודלים כאן:

https://github.com/marketplace?type=models

1. במסך המודל לוחצים Use this model ואז גוללים למטה כדי להבין מה שם המודל (זה התוכן של המשתנה model בדוגמת הקוד שמופיעה על המסך).

2. מתחברים למודל ומתחילים לקשקש עם הקוד הבא (טייפסקריפט):

import { generateText } from 'npm:ai';
import { createOpenAI } from 'npm:@ai-sdk/openai';

const ai = createOpenAI({
  apiKey: Deno.env.get('GITHUB_TOKEN'),
  baseURL: 'https://models.github.ai/inference',
});

const { text } = await generateText({
  model: ai.chat('openai/gpt-4.1'),
  prompt: 'Write a vegetarian lasagna recipe for 4 people.',
});

console.log(text);

בשביל שזה יעבוד יצרתי קובץ .env עם המפתח שלי והרצתי משורת הפקודה:

deno run --env-file=.env --allow-all demo.ts

יש שם אוסף עצום של מודלים כולם עובדים בחינם ומתחברים בצורה שקופה דרך ה AI SDK. יום אחד כשתרצו לעבור לפרודקשן תוכלו לייצר בגיטהאב טוקן שיחבר אתכם ל Azure ומשם למודל האמיתי או פשוט לעדכן את ה apiKey וה baseURL ב AI SDK כדי לעבוד עם הפרוביידר בתשלום. בגירסה החינמית של גיטהאב אפשר להריץ באזור 10 בקשות בדקה שזה אמור להספיק לזמן פיתוח.

רוצים להמשיך ללמוד על AI? אתם לא לבד. בימי חמישי בבוקר אנחנו נפגשים כל שבוע לדבר על נושא אחר מהתחום. השבוע נדבר על Code Reviews באמצעות AI. פרטים וכניסה בעמוד:

https://www.tocode.co.il/talking_ai

אנטי-תבניות ו AI זה לא שילוב טוב.

אנטי תבנית זה כשאני כותב קוד בצורה לא נכונה, ואותה צורה חוזרת על עצמה במספר מקומות במערכת. דוגמה שהיתה לי הבוקר בתוכנית ריילס היתה קוד שקורא שדות מידע מקוננים מתוך אוביקטים שמייצגים תקשורת לבסיס נתונים, כלומר נדמיין שיש לי בבסיס הנתונים טבלה של אנשים עם מחלקה לקריאת שורות בשם Person וטבלה נוספת של כתובות בשם Addresses וגם ששתי הטבלאות מחוברות עם טבלת חיבור. אז בריילס כשאני כותב:

p = Person.find(7)

# new DB query
p.addresses.first

# new DB query
p.addresses.second

# new DB query
p.addresses.third

כל פניה דרך ה Relation לטבלת ההמשך מייצרת שאילתה חדשה בבסיס הנתונים.

קוד כזה תמיד היה גרוע, אבל בעבודה עם AI אני שם לבעיה חדשה - ה AI מתיחס לקוד בתור חלק מהפרומפט ומבין מזה שלא אכפת לי מביצועים וממשיך לשכפל את התבנית הרעה בכל קוד חדש שהוא כותב. יותר מזה, אפילו אם אני לא שולח את הקובץ בקונטקסט של הפרומפט, לפעמים קופיילוט או קרסר מחפשים קוד על דעת עצמם ואז עלולים להיתקל באנטי-תבנית ולשכפל אותה. כן בדיוק כמו מתכנתים אנושיים.

ההבדל הגדול ממתכנתים אנושיים והוא המפתח לעבודה בריאה יותר עם AI הוא שאנחנו יכולים לכוון את ה AI להסתכל על דברים שונים בזמנים שונים, לדוגמה אחרי קומיט אני יכול לשלוח את תוכן כל הקומיט האחרון ל AI עם פרומפט בסגנון:

Code review my last commit:
{commit_text}

Refer to the following aspects:
    1. Security - it's a public facing system
    2. Performance - both load times and interaction time
    3. Architecture - code is core part of a big system and will be used by many developers
    4. Newer or better technology alternatives that weren't used
    5. Anti patterns in the code (for example N+1 queries)

בצורה כזאת אני יכול לקבל דוח מפורט של הבעיות. וכן אני מקווה ששמתם לב שהייתי צריך לציין ספציפית את שם האנטי תבנית שרציתי שהוא ימצא.

יום אחד אולי סוכני AI יגיעו עם כל החוכמה מובנית בפרומפטים ויהיה מספיק לבקש Code Review בשביל לקבל דוח מפורט. עד שזה יקרה שימו לב לפרומפט כדי לקבל את התוצאות שאתם צריכים.

בניסוי מעניין של קלאודפלייר הם הלכו לממש ספריית oauth באמצעות קלוד קוד והמפתח הראשי הקפיד לתת לקלוד לכתוב כמה שיותר מהקוד ובכל אינטרקציה רשם את הפרומפט בהודעת הקומיט וגם את התפתחויות השיחה. זו הודעת קומיט לדוגמה משם:

Ask Claude to merge the auth code into the grant records.
Prompt: Let's give auth codes the same treatment we did refresh tokens, that is, store them in the grants table rather than separately. So, an auth code should have the format `{userId}:{grantId}:{randomSecret}` just like tokens do, and we should store the auth code hash inside the grant record. We should also make the grant record itself expire (by setting a TTL on the KV record) if the auth code is not claimed within (by default) ten minutes. But, once it is claimed and exchanged for a refresh token, then it no longer expires.

Once again there was some sort of technical glitch where Claude's changes to `completeAuthorization()` were not applied, so I had to ask it to read them out and copy/paste manually.

Also Claude did not fully update the doc, so I tried an additional prompt:

Additional prompt: You updated the storage schema to show that authCodeId is now part of grant: records, but you didn't remove the documentation of auth_code: records. Since those no longer exist, can you please remove that from the doc?

But Claude just edited some other parts without actually removing the docs about auth_code. So I will remove it myself in the next commit.

מצד אחד בכתיבת קוד בסיוע AI הפרומפט יכול לכלול מידע סופר רלוונטי לגבי כוונת המפתח. בנוסף שמירת היסטוריה של השיחות יכולה לעזור לנו להשתפר בכתיבת פרומפטים כי עכשיו ב Code Review אפשר לדבר ולזהות תבניות שעבדו וכאלה שלא.

מצד שני לא תמיד קל לקרוא ולהבין כל מה שמופיע בפרומפט, במיוחד כשיש פרומפט מתגלגל שבו אני מבקש מה AI משהו ואז ה AI מגיב ואז ממשיכים את השיחה. יש פה גם סימפטום של "איך" במקום "מה" כלומר ההודעה מתארת איך צריך לשנות את הקוד במקום מה ההגיון או הסיבה לשינוי. ועדיין מדובר בתוספת מעניינת שיכולה לעזור בעתיד לפענח את כוונת המפתח ולעזור לחקור באגים והתנהגות של מערכת.

אני כן אשמח לראות את הפרומפטים מצורפים ל git repo אבל לא במקום הודעות קומיט. אני חושב שמנגנון כמו git-notes יכול לעבוד טוב יותר מהודעת הקומיט עצמה, ואז כלי כמו aider יוכל באופן אוטומטי אחרי כל קומיט להוסיף note עם כל פירוט השיחה שהובילה לקומיט זה, ואולי אפשר גם לכתוב תוספים ל VS Code או Cursor שיוכלו לקחת את כל השיחות שבוצעו בין שני קומיטים ולהפוך אותן ל note לקומיט האחרון.

הי כולם,

בשבועיים האחרונים העברתי פה וובינרים על AI ואיך הוא משפיע על העבודה שלנו כמפתחים. בוובינרים האלה אני משתדל להתרחק מהבאזז ולהתמקד בדברים שעובדים ובטכניקות שאני כבר היום מיישם ביום יום בעבודה עם כלי AI. העבודה עם הכלים האלה הופכת אותי למפתח מהיר יותר אבל יותר מזה הם מגדילים משמעותית את הפערים בין מפתחים. אני חושב שהם לא התלוצצו כשאמרו שזה לא AI שייקח לך את העבודה אלא מפתחים שיודעים להשתמש ב AI.

אחת הבעיות הגדולות שאני מזהה כרגע היא שאנשים מרגישים שהם יודעים לעבוד עם AI, כי זה רק צ'ט ואתה כותב לו מה שאתה רוצה וזה בדיוק כמו לדבר עם בן אדם, אבל האמת היא שזה בכלל לא כמו לדבר עם בן אדם וממשק השיחה מרמה כי הממשק לא נותן אינדיקציה ברורה לכמה טוב אתה משתמש בו. בוובינרים אני רוצה למקד את המבט שלנו באותם מדדים של פיתוח תוכנה שתמיד היו לנו ונראה איך ה AI יעבוד בשבילנו ולא להיפך. חלוקת העבודה עם AI היא היום ברורה: אנחנו מקבלים החלטות, אנחנו בונים את הארכיטקטורה, אנחנו בוחרים את האילוצים ואת ההתנהגות של המערכת וה AI מייעץ ומיישם כדי לקצר משמעותית את הזמנים.

בוובינר הראשון שהיה הראיתי איך לבנות מוצר מאפס עם AI. ראינו מה ההשפעה של קוד הסטארטר שאנחנו בוחרים ומה חשוב לכתוב בפרומפט כדי לקבל תבנית טובה להתחלה.

בוובינר השני גיל הציג משחק סנייק שהוא כתב לאייפון בעשר דקות בעזרת כלי AI ואחרי זה המשכתי להציג איך עובדים עם הכלים האלה על פרויקט קיים, איך יוצרים קובץ architecture.md ואיך מחליטים מה לתת ל AI לבנות ואיפה צריך לעבוד קצת לפני שה AI יכול להתחיל.

ובשבוע הבא אני מתכנן להראות טכניקות ב Code Review כולל איך להיעזר ב AI כדי לקבל פידבק אמין על הקוד שלנו שיעזור לנו להשתפר וממה צריך להיזהר כשקוראים פידבק ש AI יצר.

בשביל שיהיה מסודר פתחתי עמוד חדש באתר ורשימת דיוור בשם "מדברים AI". אפשר להצטרף בדף הקבוצה כאן, שגם אותו יצר כמובן AI:

https://www.tocode.co.il/talking_ai

אחרי שתירשמו שם תקבלו מיד לינק לזום למפגש הבא ואני מתכנן אחרי כל מפגש לשלוח שם סיכום מסודר ורשימה של תרגולים שכדאי לעשות כדי להשתפר בעבודה עם AI.

כן העולם משתנה. כן אין לנו כח לעוד מהפיכה. אבל זו לא בחירה שלנו, אז לפחות ננסה ליהנות ממנה.

כתיבת אייג'נט, כלומר תוכנה שעוטפת LLM כדי לשלב מבנה דטרמניסטי עם "חשיבה" לא דטרמניסטית דורשת שינוי גישה מסוים בעבודת הפיתוח. אלה כמה טיפים שלמדתי בדרך הקשה אבל היום כבר לא אוותר עליהם:

1. תיקיית Prompts - את כל הפרומפטים ל LLM אני שומר בתיקייה מסודרת, כל פרומפט בקובץ markdown משלו עם משתנים (בתוך סוגריים מסולסלים). מבנה כזה מאפשר לי לבדוק את הפרומפטים בתוך סביבות הפיתוח של הפלטפורמות ולעשות את כל ההתאמה דרך הצבת ערכים במשתנים. וכן הפרומפטים הם חלק מהקוד ונשמרים בגיט בדיוק כמו כל קובץ אחר.

2. קבלת מידע מובנה מה LLM - לאנגצ'יין וגם Vercel AI SDK יודעים לבקש מה LLM לקבל את התוצאה בצורת אוביקט וגם מוודאים שקיבלו את האוביקט הצפוי. אין שום סיבה היום לפרסר לבד תשובות של LLM-ים.

3. חלק לא מבוטל מהבקשות ייכשלו או יחזירו מידע לא נכון. יש לוודא מנגנוני Retry לכל שלב במערכת שמשתמש ב LLM.

4. עבודה עם LLM-ים יכולה לקחת זמן. יש לוודא שהמערכת תמיד יכולה לעצור תהליך באמצע ולהמשיך מאותה נקודה. זה אומר שאני מחלק את השיחה עם LLM למשימות קטנות ושומר את התוצאות של המשימות אחרי כל אחת שבוצעה כדי שאפשר יהיה להמשיך תמיד מהמשימה הבאה.

5. שילוב מידע LLM-י עם קוד רגיל - למרות ש LLM שמח לענות על כל שאלה, לא כל התשובות שלו מדויקות. אם אני רוצה להוציא מילים משיר עדיף לי להשתמש ב API מסודר שמחזיר את המילים במקום לבקש מ LLM שיאזין לשיר, כי אולי ה LLM לא יבין חלק מהמילים. אם אני צריך להוציא טקסט מ HTML שהמבנה שלו צפוי עדיף להשתמש בספריית Web Scraping קלאסית במקום לסמוך על LLM שאולי ימציא תוכן. הרבה פעמים אני אשתמש בקוד קלאסי כדי לאסוף את המידע וב LLM כדי לנתח אותו ולתמצת אותו.

6. שימו לב למודל וגם לטמפרטורה - בקריאת API אני יכול לבחור את הטמפרטורה, כלומר את מידת היצירתיות של ה LLM. יש משימות שדורשות טמפרטורה גבוהה ואחרות שעדיף שיהיו יותר דטרמניסטיות ולכן נעדיף טמפרטורה נמוכה. עדיף לשחק עם הפרמטרים בסביבת הפיתוח של הפלטפורמה ולבחור ערכים שנותנים לכם את התוצאות הטובות ביותר. וכן התוצאה היא תמיד שילוב של הפרומפט, המודל והטמפרטורה.

רוצים לשמוע יותר על עבודה עם AI על פרויקט קיים? בואו לוובינר! היום בשעה 10:00 אספר בהרחבה על כל הטיפים פה בפוסט ואף יותר. הוובינר ללא הקלטה כדי שאפשר יהיה לדבר ברוגע על מהפכת ה AI והפחד, ההתרגשות והשינוי שהיא מביאה. זה הלינק:

https://us06web.zoom.us/j/86295492018?pwd=7lGAenxpaXM7oe25PqcDzFkWrhNqpS.1

ועכשיו תקציר הטיפים לאלה מכם שלא יצליחו להגיע:

1. סדר וארגון - כשאתם מקופיילוט לבצע משימה על פרויקט קיים הוא קודם כל מנסה להבין את המשימה ובשביל זה הוא מנסה להבין את מבנה הפרויקט. הבעיה היא שהוא צריך להבין את מבנה הפרויקט כל פעם מחדש וזה מתסכל ופותח פתח לטעויות. במקום לתת לקופיילוט לעבוד קשה בקשו ממנו פעם אחת לנתח את מבנה הפרויקט ולבנות קובץ architecture.md שמתאר את כל ארכיטקטורת המערכת, כולל כל מבנה התיקיות והטבלאות בבסיס הנתונים. את הקובץ תוכלו לצרף לכל משימה עתידית או לכתוב כלל שקופיילוט שיצרף אותו אוטומטית.

2. אבטסטרקציות - כלי AI אלופים בשכפול, זיהוי תבניות וחזרה עליהן והרבה פחות טובים בזיהוי אבסטרקציות, חשיבה יצירתית וארגון קוד למבנה שמתאים בדיוק לפרויקט שלכם (או קבלת החלטות באופן כללי). לכן וודאו שמבנה התיקיות בפרויקט הוא הגיוני וברור איזה קבצים צריך לעדכן לכל משימה. בשביל שלא יתפזר אני מוסיף תמיד את רשימת כל הקבצים שצריך לערוך במשימה מסוימת לקונטקסט וממש כותב "יש לערוך רק את הקבצים שכאן".

3. שימוש ב Linters ובאופן כללי עבודה בשפות עם טיפוסים חזקים - קופיילוט כותב קוד ואז באיטרציה נוספת מסתכל על אזהרות ה Linter על הקוד הזה ומתקן את הבעיות. לכן ניתוח סטטי של הקוד שנוצר יכול לעזור באותו "סיבוב שני" של תיקונים.

4. תיאור תהליכים מרכזיים במערכת - כמו שכתבנו את architecture.md כדאי לכתוב קובץ flows.md או processes.md שיתאר את התהליכים המרכזיים של המערכת ואיזה קבצים ופונקציות מקושרים לכל תהליך. וכן כדאי לתת ל AI לכתוב גם את הקובץ הזה ולזכור לעדכן אותו כל פעם שמשנים קוד. ככל שהמידע שם יותר מדויק יהיה ל AI קל יותר לבצע משימות (ופה יש הבדל מורגש בין Cursor ל Copilot. קרסר בונה לעצמו RAG מכל המידע של הפרויקט ולכן יותר קל לו להתמצא, בקופיילוט אנחנו צריכים לעשות את העבודה).

5. אם יש לכם סט בדיקות לפרויקט תוכלו לחבר את הרצת הבדיקות בתור "כלי" או MCP Server ואז קופיילוט יוכל אחרי שהוא כותב קוד לוודא שהוא לא שבר כלום וגם להוסיף בדיקות על קוד חדש.

6. שימו לב לשיחה עם ה AI והתחילו לעבוד בפינוי מכשולים - ה AI מנסה למצוא איפה משתמשים בפרויקט במנגנון מסוים? הוסיפו את זה לקבצי הסיכום. ה AI מנסה לגשת לקבצים לא קשורים? עדכנו את ה Prompt והסבירו לו על איזה קבצים לעבוד. ה AI מנסה לכתוב לעצמו קובץ הגדרות טיפוסים של ריאקט? בדקו למה הוא לא מוצא את קובץ הטיפוסים הרגיל. התאמת הפרויקט לעבודה עם AI היא תהליך איטרטיבי בו אנחנו מזהים איזה דברים גורמים ל AI להתפזר, מחזירים אותו למסלול ומתקנים את המכשול בפרויקט כדי שפעם הבאה הוא לא ירד מהשביל. בהתחלה זה המון עבודה אבל אז זה משתפר ורואים תוצאות.

רוצים לראות דוגמאות קונקרטיות על פרויקט אמיתי? לשתף בקשיים שלכם ולשמוע עוד חוות דעת? בואו נדבר, היום בעשר בזום.