-->

نظرة عامة

Nanobrowser هو إضافة Chrome مفتوحة المصدر ومبتكرة لأتمتة الويب المدعومة بالذكاء الاصطناعي. صُمِّمت هذه الأداة كبديل لـ OpenAI Operator، وتتيح أتمتة سير عمل الويب المعقدة من خلال نظام متعدد الوكلاء. يغطي هذا الدليل كل شيء بدءًا من التثبيت وصولًا إلى استراتيجيات Agentic Ops المتقدمة.

مقدمة إلى Nanobrowser

Nanobrowser هو نظام يتعاون فيه ثلاثة وكلاء ذكاء اصطناعي متخصصون لتنفيذ أتمتة الويب:

  • Navigator: التنقل في صفحات الويب والتفاعل مع العناصر
  • Planner: التخطيط للمهام واتخاذ قرارات الاستراتيجية
  • Validator: التحقق من نتائج المهام وضمان الجودة

الميزات الرئيسية

  • نظام متعدد الوكلاء: وكلاء ذكاء اصطناعي متخصصون يتعاونون حسب الأدوار
  • لوحة جانبية تفاعلية: تحديثات الحالة في الوقت الفعلي وواجهة دردشة
  • أتمتة المهام: الأتمتة الكاملة لمهام الويب المتكررة
  • سجل المحادثات: إدارة سجلات تفاعل وكلاء الذكاء الاصطناعي
  • دعم نماذج LLM متعددة: OpenAI, Anthropic, Gemini, Ollama, Groq, Cerebras وغيرها

التثبيت والإعداد الأولي

1. التثبيت من متجر Chrome

تثبيت الإصدار المستقر:

# قم بزيارة متجر Chrome
https://chrome.google.com/webstore/detail/nanobrowser

2. التثبيت اليدوي لأحدث إصدار

يُوصى بالتثبيت اليدوي للحصول على تحديثات أسرع:

# 1. تنزيل أحدث إصدار من GitHub
curl -L -o nanobrowser.zip https://github.com/nanobrowser/nanobrowser/releases/latest/download/nanobrowser.zip

# 2. فك الضغط عن الأرشيف
unzip nanobrowser.zip

# 3. تثبيت إضافة Chrome
# انتقل إلى chrome://extensions/
# قم بتفعيل وضع المطور
# انقر على "تحميل غير مضغوط"
# حدد مجلد nanobrowser

3. البناء من المصدر

يمكن للمطورين البناء مباشرةً من المصدر:

# استنساخ المستودع
git clone https://github.com/nanobrowser/nanobrowser.git
cd nanobrowser

# تثبيت التبعيات (يتطلب Node.js v22.12.0+)
pnpm install

# بناء الإنتاج
pnpm build

# التشغيل في وضع التطوير
pnpm dev

4. تكوين نماذج الوكلاء

بعد التثبيت، قم بتكوين النموذج لكل وكيل:

{
  "agents": {
    "planner": "claude-3-5-sonnet-20241022",
    "navigator": "claude-3-5-haiku-20241022", 
    "validator": "claude-3-5-sonnet-20241022"
  },
  "apiKeys": {
    "anthropic": "sk-ant-xxxxx",
    "openai": "sk-xxxxx",
    "google": "xxxxx"
  }
}

استراتيجية اختيار النموذج

تكوين الأداء العالي

للحصول على أفضل أداء:

{
  "planner": "claude-3-5-sonnet-20241022",
  "validator": "claude-3-5-sonnet-20241022", 
  "navigator": "claude-3-5-haiku-20241022"
}

التكوين الموفر للتكلفة

عندما تكون توفير التكاليف أولوية:

{
  "planner": "gpt-4o-mini",
  "validator": "claude-3-5-haiku-20241022",
  "navigator": "gemini-2.0-flash"
}

تكوين النماذج المحلية

للخصوصية الكاملة وتكاليف API صفرية:

# إعداد Ollama
ollama serve
ollama pull qwen2.5-coder:14b
ollama pull mistral-small:24b

# تكوين nanobrowser
{
  "planner": "ollama/mistral-small:24b",
  "validator": "ollama/qwen2.5-coder:14b", 
  "navigator": "ollama/qwen2.5-coder:14b",
  "baseUrl": "http://localhost:11434/v1"
}

الاستخدام الأساسي

1. أمثلة على المهام البسيطة

تجميع الأخبار:

"اذهب إلى TechCrunch واستخرج أفضل 10 عناوين رئيسية من آخر 24 ساعة"

بحث GitHub:

"ابحث عن أكثر مستودعات Python رواجًا وحاملًا للنجوم على GitHub"

بحث التسوق:

"ابحث عن مكبر صوت Bluetooth محمول ومقاوم للماء على Amazon. يجب أن يكون أقل من 50 دولارًا وأن يتمتع بعمر بطارية لا يقل عن 10 ساعات"

2. أمثلة على سير العمل المعقدة

تحليل المنافسين:

"اجمع معلومات إطلاق أحدث المنتجات من مواقع 3 شركات منافسة،
ثم أنشئ جدول مقارنة للأسعار والميزات الرئيسية"

استراتيجيات Agentic Ops

1. أتمتة DevOps

مراقبة CI/CD

// مراقبة حالة GitHub Actions
const monitoringTask = `
تحقق من أحدث حالة CI/CD لـ 5 مستودعات رئيسية على GitHub.
إذا كانت هناك أي عمليات بناء فاشلة، اجمع سجلات الأخطاء وأرسل تقريرًا ملخصًا إلى Slack.
`;

// الاستخدام
nanobrowser.execute(monitoringTask, {
  schedule: "*/30 * * * *", // تشغيل كل 30 دقيقة
  notify: ["slack://devops-channel"]
});

فحص صحة البنية التحتية

const infraCheck = `
سجّل الدخول إلى وحدة تحكم AWS وتحقق من حالة الموارد التالية:
1. نسخ EC2 التي يتجاوز استخدامها لـ CPU نسبة 80%
2. قواعد البيانات التي تقترب فيها عدد اتصالات RDS من الحدود القصوى
3. تنبيهات CloudWatch النشطة
قم بتجميع النتائج في تقرير على شكل لوحة تحكم.
`;

2. إدارة خطوط أنابيب البيانات

مراقبة جودة البيانات

const dataQualityCheck = `
افحص مصادر البيانات التالية بالتسلسل وأنشئ تقرير جودة البيانات:
1. تحقق من حجم البيانات المحملة أمس في وحدة تحكم الويب لـ Snowflake
2. تحقق من حالة تحديث البيانات للوحات التحكم الرئيسية في Tableau
3. تحقق مما إذا كانت هناك أي DAGs فاشلة في Airflow UI
اجمع معلومات تفصيلية عن أي مشكلات موجودة في كل نظام.
`;

جمع البيانات التلقائي

const dataCollection = `
قم تلقائيًا بتنفيذ المهام التالية كل يوم في الساعة 9 صباحًا:
1. تنزيل بيانات حركة المرور على الموقع من أمس من Google Analytics
2. جمع بيانات أداء الحملات من Facebook Ads Manager
3. رفع البيانات المجمعة إلى الورقة المخصصة في Google Sheets
4. احسب معدل التغيير اليومي للمقاييس الرئيسية وأنشئ تقريرًا ملخصًا
`;

3. أتمتة عمليات الأمان

أتمتة فحص الثغرات الأمنية

const securityScan = `
نفّذ المهام التالية بالترتيب للفحص الأمني الأسبوعي:
1. تحقق من التنبيهات الأمنية الجديدة في تبويب GitHub Security
2. اجمع نتائج فحص ثغرات التبعيات من لوحة تحكم Snyk
3. تحقق من انتهاكات الامتثال في AWS Security Hub
4. صنّف جميع المشكلات المكتشفة حسب الأولوية وأنشئ تذاكر JIRA
`;

مراقبة الامتثال

const complianceCheck = `
لفحص الامتثال للـ GDPR:
1. تحقق من سياسات الاحتفاظ بالسجلات لأنظمة معالجة البيانات الشخصية
2. راجع حالة معالجة طلبات حذف البيانات
3. تحقق مما إذا كانت عقود مشاركة البيانات مع أطراف ثالثة تحتاج إلى تجديد
قم بتنظيم النتائج في تنسيق مناسب للإبلاغ لفريق الامتثال.
`;

4. أتمتة دعم العملاء

تصنيف التذاكر وتوجيهها

const ticketManagement = `
حلّل تذاكر دعم العملاء المستلمة في Zendesk خلال الساعتين الماضيتين:
1. التصنيف التلقائي حسب الأهمية والفئة
2. اقتراح الحلول إذا كانت مشكلات مماثلة قد حُلَّت في الماضي
3. تصعيد المشكلات التقنية المعقدة تلقائيًا إلى فريق التطوير
4. توليد ردود تلقائية على الأسئلة البسيطة ذات طابع الأسئلة الشائعة
`;

تحليل ملاحظات العملاء

const feedbackAnalysis = `
اجمع ملاحظات العملاء من قنوات متعددة وحللها:
1. اجمع أحدث المراجعات من App Store وGoogle Play Store
2. راقب ذكر منتجنا على وسائل التواصل الاجتماعي (Twitter, Reddit)
3. استخرج الشكاوى المتكررة من سجلات دردشة دعم العملاء
4. استنتج الرؤى من خلال تحليل المشاعر وتحليل الكلمات المفتاحية
`;

5. أتمتة التسويق

مراقبة المنافسين

const competitorAnalysis = `
راقب الأنشطة التسويقية لـ 3 منافسين رئيسيين:
1. تحقق من الإعلانات الجديدة على مدونة وقسم الأخبار لكل شركة
2. حلّل الحملات التسويقية الأخيرة على LinkedIn وTwitter
3. اكتشف تغييرات الأسعار أو إضافة ميزات جديدة على صفحات المنتجات
4. قم بتجميع المعلومات المجمعة في تقرير ذكاء تسويقي
`;

تحليل أداء المحتوى

const contentPerformance = `
أجرِ تحليلًا شاملًا لأداء تسويق المحتوى لدينا:
1. اجمع مشاهدات وإعجابات وتعليقات مقاطع الفيديو المحملة مؤخرًا على YouTube
2. تحقق من بيانات Google Analytics لمنشورات المدونة
3. حلّل معدلات التفاعل لمنشورات LinkedIn
4. حدّد السمات المشتركة للمحتوى الأفضل أداءً واقترح إرشادات لإنشاء المحتوى المستقبلي
`;

حالات الاستخدام المتقدمة

1. تكامل البيانات عبر المنصات

const crossPlatformIntegration = `
تحديث لوحة تحكم KPI لأعمال التجارة الإلكترونية:
1. اجمع بيانات الإيرادات اليومية وعدد الطلبات ومعدل الاسترداد من Shopify Admin
2. تحقق من الإنفاق الإعلاني ومعدل النقر ومعدل التحويل من Facebook Ads Manager
3. حلّل حركة مرور الموقع حسب المصدر من Google Analytics
4. حدّث جميع البيانات تلقائيًا في قاعدة بيانات Notion
5. حلّل الاتجاهات الأسبوعية للمقاييس الرئيسية وقم بإعداد التنبيهات
`;

// إعداد الجدول الزمني
nanobrowser.schedule(crossPlatformIntegration, {
  cron: "0 9 * * 1", // كل اثنين في الساعة 9 صباحًا
  timezone: "Asia/Seoul"
});

2. نظام المراقبة في الوقت الفعلي

const realTimeMonitoring = `
مراقبة حالة الخدمة في الوقت الفعلي:
1. تحقق من أوقات الاستجابة ورموز الحالة لنقاط نهاية API الرئيسية
2. راقب استخدام مجمع اتصالات قاعدة البيانات
3. تحقق من معدل إصابة ذاكرة التخزين المؤقت CDN ومعدل الأخطاء
4. أرسل تنبيه PagerDuty فورًا عند اكتشاف الشذوذات
5. قم بتحديث صفحة الحالة تلقائيًا
`;

3. نظام إعداد التقارير التلقائي

const executiveReporting = `
أنشئ تقريرًا شهريًا شاملًا للمديرين التنفيذيين:
1. اجمع بيانات الإيرادات والتكاليف والهامش من النظام المالي
2. تحقق من عدد الموظفين ومعدل الدوران ومقاييس الرضا من نظام HR
3. اجمع بيانات توليد العملاء المحتملين وتكلفة اكتسابهم من المنصات التسويقية
4. قم بتجميع المقاييس التقنية (وقت تشغيل النظام وعدد عمليات النشر ومعدل حل الأخطاء)
5. أدخل جميع البيانات تلقائيًا في قالب PowerPoint لإنتاج تقرير مكتمل
`;

الأمان والحوكمة

1. أفضل ممارسات الأمان

إدارة مفاتيح API

// استخدام متغيرات البيئة
const secureConfig = {
  apiKeys: {
    anthropic: process.env.ANTHROPIC_API_KEY,
    openai: process.env.OPENAI_API_KEY
  },
  // إعدادات تدوير المفاتيح
  keyRotation: {
    enabled: true,
    interval: "30d"
  }
};

التحكم في الوصول

const accessControl = {
  users: {
    "devops-team": ["infrastructure", "monitoring"],
    "security-team": ["security-scan", "compliance"],
    "marketing-team": ["competitor-analysis", "content-performance"]
  },
  // إعدادات الأذونات على مستوى المهام
  permissions: {
    "aws-console": ["devops-team", "security-team"],
    "social-media": ["marketing-team"],
    "financial-data": ["finance-team", "executives"]
  }
};

2. سجلات التدقيق والتتبع

const auditLogging = `
أنشئ سجلات تدقيق لجميع عمليات nanobrowser:
1. سجّل تفاصيل المهام المنفذة وطوابعها الزمنية
2. أدرج قائمة بالأنظمة والبيانات التي تم الوصول إليها
3. تتبع نتائج المهام والتغييرات
4. ضع علامة منفصلة على الأحداث المتعلقة بالأمان
5. قدّم تقارير منتظمة لفريق الامتثال
`;

تحسين الأداء

1. تحسين نماذج الوكلاء

// اختيار النموذج الديناميكي بناءً على تعقيد المهمة
const adaptiveModelSelection = {
  simple: {
    planner: "gpt-4o-mini",
    navigator: "claude-3-5-haiku",
    validator: "gpt-4o-mini"
  },
  complex: {
    planner: "claude-3-5-sonnet",
    navigator: "claude-3-5-haiku", 
    validator: "claude-3-5-sonnet"
  },
  // منطق تحديد التعقيد التلقائي
  complexityThreshold: {
    steps: 5,
    platforms: 3,
    dataVolume: "10MB"
  }
};

2. المعالجة المتوازية والمهام الدفعية

const batchProcessing = `
مهام دفعية لمعالجة البيانات الضخمة:
1. اجمع معلومات الأسعار من 1000 صفحة منتج
2. قسّم العمل إلى 10 دفعات وعالجها بالتوازي
3. احفظ النتائج الوسيطة بعد اكتمال كل دفعة
4. تحقق من جودة البيانات بعد اكتمال المهمة بأكملها
5. ارفع النتائج النهائية إلى قاعدة البيانات بشكل مجمّع
`;

استكشاف الأخطاء وإصلاحها والتصحيح

1. المشكلات الشائعة

فشل تسجيل الدخول

const loginTroubleshooting = `
معالجة فشل تسجيل الدخول التلقائي:
1. استخدم رموز النسخ الاحتياطي للحسابات التي تم تفعيل المصادقة الثنائية عليها
2. حاول إعادة تسجيل الدخول تلقائيًا عند انتهاء صلاحية الجلسة
3. اطلب تدخلًا يدويًا من المستخدم عند اكتشاف CAPTCHA
4. انتظر فترة محددة وأعد المحاولة بعد الفشل المتكرر
`;

فشل تحديد موقع العناصر

const elementLocationFix = `
حلول لفشل تحديد موقع عناصر الويب:
1. زد وقت الانتظار لاكتمال تحميل الصفحة
2. جرّب تركيبات محددات مختلفة (CSS, XPath, نص)
3. للمحتوى الديناميكي، أطلق التحميل بالتمرير أو النقر
4. التقط لقطة شاشة عند الخطأ لتوفير معلومات التصحيح
`;

2. ضبط الأداء

تحسين وقت الاستجابة

const performanceOptimization = {
  // تحسين تحميل الصفحة
  pageLoad: {
    timeout: 30000,
    waitUntil: "networkidle2",
    blockResources: ["image", "font", "media"]
  },
  // تحسين استجابة الوكيل
  agentOptimization: {
    maxTokens: 2048,
    temperature: 0.1,
    caching: true
  }
};

أمثلة على التطبيق الفعلي

1. نظام مراقبة التجارة الإلكترونية

// مراقبة شاملة تعمل يوميًا
const ecommerceMonitoring = async () => {
  const tasks = [
    {
      name: "inventory-check",
      description: `
        تحقق من حالة المخزون للمنتجات الرئيسية:
        1. أنشئ قائمة بالمنتجات منخفضة المخزون (10 وحدات أو أقل)
        2. حلّل معدل دوران المخزون للمنتجات الأكثر مبيعًا
        3. تحقق من حالة تأخر التسليم لكل مورد
        4. أنشئ قائمة أولويات للمنتجات التي تحتاج إلى إعادة طلب
      `,
      schedule: "0 8 * * *" // يوميًا في الساعة 8 صباحًا
    },
    {
      name: "competitor-pricing",
      description: `
        مراقبة أسعار المنافسين:
        1. اجمع أسعار المنتجات المماثلة من 3 منافسين رئيسيين
        2. تحليل مقارن مع أسعارنا
        3. حلّل أنماط تغيرات الأسعار
        4. اقترح توصيات تعديل الأسعار
      `,
      schedule: "0 10 * * *" // يوميًا في الساعة 10 صباحًا
    }
  ];

  // تنفيذ متوازٍ
  const results = await Promise.all(
    tasks.map(task => nanobrowser.execute(task.description))
  );
  
  return results;
};

2. خط أنابيب أتمتة DevOps

const devopsAutomation = {
  // أتمتة الاستجابة للحوادث
  incidentResponse: `
    الاستجابة التلقائية عند حدوث عطل في النظام:
    1. تحديد حالة العطل من لوحة تحكم المراقبة
    2. تقدير عدد الخدمات والمستخدمين المتأثرين
    3. البحث عن حلول من حوادث مماثلة سابقة
    4. إرسال إشعارات تلقائية للفرق ذات الصلة
    5. تطبيق إصلاحات مؤقتة ومراقبة الحالة
  `,
  
  // التحقق من صحة النشر
  deploymentValidation: `
    التحقق التلقائي بعد نشر إصدار جديد:
    1. فحص صحة نقاط نهاية API الرئيسية
    2. اختبار سيناريوهات تدفق المستخدم
    3. مراقبة معدلات الأخطاء وأوقات الاستجابة
    4. مقارنة المقاييس قبل النشر وبعده
    5. تشغيل التراجع التلقائي إذا وُجدت مشكلات
  `,
  
  // التدقيق الأمني
  securityAudit: `
    أتمتة الفحص الأمني الأسبوعي:
    1. مراجعة نتائج فحص ثغرات التبعيات
    2. اكتشاف الأنماط الشاذة في سجلات الوصول
    3. التحقق من انتهاء صلاحية شهادات SSL القادم
    4. فحص حالة الامتثال لسياسات الأمان
    5. تقييم مستوى المخاطرة للمشكلات المكتشفة
  `
};

الاتجاهات المستقبلية

1. تطور وكلاء الذكاء الاصطناعي

const futureCapabilities = {
  // وكلاء التعلم الذاتي
  selfLearning: {
    description: "تحسين الأداء من خلال التعلم من أنماط نجاح وفشل المهام السابقة",
    implementation: "التحسين المبني على التعلم المعزز"
  },
  
  // المعالجة متعددة الوسائط
  multimodal: {
    description: "وكلاء شاملون يعالجون الصور والفيديو والصوت",
    useCases: ["تحليل محتوى الفيديو", "فحص الجودة المبني على الصور"]
  },
  
  // سير العمل باللغة الطبيعية
  naturalLanguage: {
    description: "تنفيذ منطق أعمال معقد باستخدام لغة يومية",
    example: "إذا انخفضت الإيرادات الشهرية بنسبة 10% مقارنة بالشهر السابق، زد ميزانية التسويق بنسبة 20%"
  }
};

2. النظام البيئي التكاملي

const integrationEcosystem = {
  // تكاملات أدوات المؤسسات
  enterprise: [
    "Salesforce", "SAP", "Oracle", "Microsoft Dynamics",
    "Workday", "ServiceNow", "Jira", "Confluence"
  ],
  
  // تكاملات أدوات المطورين
  developer: [
    "GitHub", "GitLab", "Jenkins", "Docker", "Kubernetes",
    "Datadog", "New Relic", "PagerDuty", "Splunk"
  ],
  
  // تكاملات ذكاء الأعمال
  bi: [
    "Tableau", "Power BI", "Looker", "Qlik",
    "Snowflake", "BigQuery", "Redshift", "Databricks"
  ]
};

الخاتمة

يتطور Nanobrowser ليتجاوز كونه مجرد أداة بسيطة لأتمتة الويب، إذ يتحول إلى منصة Agentic Ops شاملة. من خلال تعاون نظام متعدد الوكلاء، يمكن أتمتة سير عمل الأعمال المعقدة، كما يمكن الاستفادة من نماذج LLM المتنوعة لتحسين الأداء والتكلفة.

وعلى وجه الخصوص، يمكن تعزيز إنتاجية الفرق بشكل كبير من خلال أتمتة المهام المتكررة والمستهلكة للوقت في مجالات متنوعة كـ DevOps وخطوط أنابيب البيانات وعمليات الأمان ودعم العملاء والتسويق.

بوصفه مشروعًا مفتوح المصدر، يستمر في التطور من خلال مساهمات المجتمع، كما يمكن تخصيصه لتلبية متطلبات المؤسسات الخاصة.

إذا كنت ترغب في تجربة النموذج الجديد لـ Agentic Ops، ابدأ بـ nanobrowser!

المراجع

참고