{"id":20895,"date":"2026-08-04T16:07:14","date_gmt":"2026-08-04T13:07:14","guid":{"rendered":"https:\/\/offline-web.com\/?page_id=20895"},"modified":"2026-09-21T14:38:48","modified_gmt":"2026-09-21T11:38:48","slug":"ai-integration","status":"publish","type":"page","link":"https:\/\/offline-web.com\/en\/ai-integration\/","title":{"rendered":"AI integration for web applications"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-page\" data-elementor-id=\"20895\" class=\"elementor elementor-20895\" data-elementor-settings=\"{&quot;ha_cmc_init_switcher&quot;:&quot;no&quot;}\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-4f0e91b9 e-flex e-con-boxed tm-col-stretched-none tm-bg-color-over-image e-con e-parent\" data-id=\"4f0e91b9\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t<div class=\"elementor-element elementor-element-6c4fa7a2 e-con-full e-flex tm-col-stretched-none tm-bg-color-over-image e-con e-child\" data-id=\"6c4fa7a2\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t<div class=\"elementor-element elementor-element-592ca323 e-con-full e-flex tm-col-stretched-none tm-bg-color-over-image e-con e-child\" data-id=\"592ca323\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-766590d elementor-widget elementor-widget-image\" data-id=\"766590d\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.button-over-image\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"1024\" height=\"538\" src=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration-1024x538.png\" class=\"attachment-large size-large wp-image-20888\" alt=\"AI features for Vue and Nuxt apps \u2014 an in-product copilot streaming an answer with cited sources\" srcset=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration-1024x538.png 1024w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration-300x158.png 300w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration-768x403.png 768w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration.png 1200w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-3cb1a854 e-con-full tm-col-stretched-none e-flex tm-bg-color-over-image e-con e-child\" data-id=\"3cb1a854\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t<div class=\"elementor-element elementor-element-1f403bd2 e-con-full e-flex tm-col-stretched-none tm-bg-color-over-image e-con e-child\" data-id=\"1f403bd2\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6d6314ad elementor-widget elementor-widget-tm-ele-text-editor\" data-id=\"6d6314ad\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"tm-text-editor\" >\r\n\t\t<p>AI is most useful when it becomes a real product function rather than a disconnected demo. The work starts with the user action the feature needs to support, the data it can access and the limits that keep behavior and cost under control.<\/p>\t\t<\/div>\r\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4fd2d9de elementor-widget elementor-widget-tm-ele-text-editor\" data-id=\"4fd2d9de\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"tm-text-editor\" >\r\n\t\t<h2>AI as a product function<\/h2><p>Assistants, retrieval and agents should be designed around a real workflow inside the product rather than added as a generic chat box.<\/p><h3>Not every feature needs AI<\/h3><p>If a normal rule, search or form solves the problem more reliably, that is usually the better solution.<\/p><h3>Models and technologies<\/h3><p>The model and provider are selected for the use case. The architecture should make it possible to change providers or models without rebuilding the whole product.<\/p><h3>Data access and control<\/h3><p>Access rules, tenant boundaries, cost controls and safe tool usage must be part of the feature design from the beginning.<\/p>\t\t<\/div>\r\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-d0cd627 e-con-full e-flex tm-col-stretched-none tm-bg-color-over-image e-con e-child\" data-id=\"d0cd627\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-44af6788 elementor-widget__width-initial elementor-widget elementor-widget-tm-ele-iconbox\" data-id=\"44af6788\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-iconbox.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"tm-sc-icon-box icon-box icon-left icon-left-style2 icon-text responsive-mobile icon-left-style2 animate-hover icon-rotate-y\">\r\n\t\r\n  \t<div class=\"icon-box-wrapper\">\r\n\t\t<div class=\"icon-left-block\">\r\n\t\t\t<div class=\"icon-box-icon\">\r\n\t\t\t\t\r\n\t\t<div class=\"icon-wrapper\">\r\n\t\t<div class=\"icon icon-round icon-type-icon-text icon-size-default\">\r\n\t\t\t\r\n\t\t\t\t<span class=\"icon-text\">\r\n\t\t\t\t01\t\t<\/span>\r\n\t\t\t\t<\/div>\r\n\r\n\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\r\n\t\t\t\t<h5 class=\"icon-box-title \">\r\n\t\t\t\t\t\t\tDefine the use case\t\t\t\t\t<\/h5>\r\n\t\t\t\t\t\t\t<\/div>\r\n\t\t<div class=\"icon-text\">\r\n\t\t\t\t\t\t<div class=\"content\">The work starts with the user action the feature needs to support and whether AI is actually the right solution for it.<\/div>\r\n\t\t\t\r\n\t\t\t\r\n\t\r\n\t\t\t\t\t<\/div>\r\n\t\t<div class=\"clearfix\"><\/div>\r\n\t<\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5e59e3a3 elementor-widget__width-initial elementor-widget elementor-widget-tm-ele-iconbox\" data-id=\"5e59e3a3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-iconbox.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"tm-sc-icon-box icon-box icon-left icon-left-style2 icon-text responsive-mobile icon-left-style2 animate-hover icon-rotate-y\">\r\n\t\r\n  \t<div class=\"icon-box-wrapper\">\r\n\t\t<div class=\"icon-left-block\">\r\n\t\t\t<div class=\"icon-box-icon\">\r\n\t\t\t\t\r\n\t\t<div class=\"icon-wrapper\">\r\n\t\t<div class=\"icon icon-default icon-type-icon-text icon-size-default\">\r\n\t\t\t\r\n\t\t\t\t<span class=\"icon-text\">\r\n\t\t\t\t02\t\t<\/span>\r\n\t\t\t\t<\/div>\r\n\r\n\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\r\n\t\t\t\t<h5 class=\"icon-box-title \">\r\n\t\t\t\t\t\t\tDefine data and access\t\t\t\t\t<\/h5>\r\n\t\t\t\t\t\t\t<\/div>\r\n\t\t<div class=\"icon-text\">\r\n\t\t\t\t\t\t<div class=\"content\">Access rules, tenant boundaries, cost controls and safe tool usage are defined as part of the feature design.<\/div>\r\n\t\t\t\r\n\t\t\t\r\n\t\r\n\t\t\t\t\t<\/div>\r\n\t\t<div class=\"clearfix\"><\/div>\r\n\t<\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-14cd3a65 e-con-full tm-col-stretched-none e-flex tm-bg-color-over-image e-con e-child\" data-id=\"14cd3a65\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-1887c9ac elementor-widget__width-initial elementor-widget elementor-widget-tm-ele-iconbox\" data-id=\"1887c9ac\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-iconbox.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"tm-sc-icon-box icon-box icon-left icon-left-style2 icon-text responsive-mobile icon-left-style2 animate-hover icon-rotate-y\">\r\n\t\r\n  \t<div class=\"icon-box-wrapper\">\r\n\t\t<div class=\"icon-left-block\">\r\n\t\t\t<div class=\"icon-box-icon\">\r\n\t\t\t\t\r\n\t\t<div class=\"icon-wrapper\">\r\n\t\t<div class=\"icon icon-round icon-type-icon-text icon-size-default\">\r\n\t\t\t\r\n\t\t\t\t<span class=\"icon-text\">\r\n\t\t\t\t03\t\t<\/span>\r\n\t\t\t\t<\/div>\r\n\r\n\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\r\n\t\t\t\t<h5 class=\"icon-box-title \">\r\n\t\t\t\t\t\t\tImplement and evaluate\t\t\t\t\t<\/h5>\r\n\t\t\t\t\t\t\t<\/div>\r\n\t\t<div class=\"icon-text\">\r\n\t\t\t\t\t\t<div class=\"content\">The feature is built and evaluated against real cases, so behavior and quality are measured before release.<\/div>\r\n\t\t\t\r\n\t\t\t\r\n\t\r\n\t\t\t\t\t<\/div>\r\n\t\t<div class=\"clearfix\"><\/div>\r\n\t<\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4d0e8691 elementor-widget__width-initial elementor-widget elementor-widget-tm-ele-iconbox\" data-id=\"4d0e8691\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-iconbox.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"tm-sc-icon-box icon-box icon-left icon-left-style2 icon-text responsive-mobile icon-left-style2 animate-hover icon-rotate-y\">\r\n\t\r\n  \t<div class=\"icon-box-wrapper\">\r\n\t\t<div class=\"icon-left-block\">\r\n\t\t\t<div class=\"icon-box-icon\">\r\n\t\t\t\t\r\n\t\t<div class=\"icon-wrapper\">\r\n\t\t<div class=\"icon icon-round icon-type-icon-text icon-size-default\">\r\n\t\t\t\r\n\t\t\t\t<span class=\"icon-text\">\r\n\t\t\t\t04\t\t<\/span>\r\n\t\t\t\t<\/div>\r\n\r\n\t\t\t<\/div>\r\n\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\r\n\t\t\t\t<h5 class=\"icon-box-title \">\r\n\t\t\t\t\t\t\tPut the feature into production\t\t\t\t\t<\/h5>\r\n\t\t\t\t\t\t\t<\/div>\r\n\t\t<div class=\"icon-text\">\r\n\t\t\t\t\t\t<div class=\"content\">The feature goes into production with monitoring and limits on behavior, latency and cost.<\/div>\r\n\t\t\t\r\n\t\t\t\r\n\t\r\n\t\t\t\t\t<\/div>\r\n\t\t<div class=\"clearfix\"><\/div>\r\n\t<\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-203048ca elementor-widget elementor-widget-tm-ele-text-editor\" data-id=\"203048ca\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"tm-text-editor\" >\r\n\t\t<h2>What can be added<\/h2>\t\t<\/div>\r\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-25734f74 elementor-widget elementor-widget-tm-ele-list\" data-id=\"25734f74\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-list.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<ul class=\"tm-sc-list \">\r\n\t<li class=\"\">\r\n\t\t\t\t<i aria-hidden=\"true\" class=\" flaticon-common-confirmation\"><\/i>\t\t\t\t<span>\r\n\tAI assistants<\/span><\/li>\t<li class=\"\">\r\n\t\t\t\t<i aria-hidden=\"true\" class=\" flaticon-common-confirmation\"><\/i>\t\t\t\t<span>\r\n\tSearch across data and content<\/span><\/li>\t<li class=\"\">\r\n\t\t\t\t<i aria-hidden=\"true\" class=\" flaticon-common-confirmation\"><\/i>\t\t\t\t<span>\r\n\tContent processing<\/span><\/li>\t<li class=\"\">\r\n\t\t\t\t<i aria-hidden=\"true\" class=\" flaticon-common-confirmation\"><\/i>\t\t\t\t<span>\r\n\tAI agents and automation<\/span><\/li>\t<li class=\"\">\r\n\t\t\t\t<i aria-hidden=\"true\" class=\" flaticon-common-confirmation\"><\/i>\t\t\t\t<span>\r\n\tAI functions on top of existing business data<\/span><\/li><\/ul>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-55ed9aa7 e-con-full e-flex tm-col-stretched-none tm-bg-color-over-image e-con e-child\" data-id=\"55ed9aa7\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t<div class=\"elementor-element elementor-element-d12fdde e-con-full e-flex tm-col-stretched-none tm-bg-color-over-image e-con e-child\" data-id=\"d12fdde\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-55b846b6 elementor-widget elementor-widget-image\" data-id=\"55b846b6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-1-1024x576.png\" class=\"attachment-large size-large wp-image-20889\" alt=\"Before and after: a blocking fetch replaced by a streaming copilot response with cancellation and citations in Vue\" srcset=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-1-1024x576.png 1024w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-1-300x169.png 300w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-1-768x432.png 768w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-1.png 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-569a857e e-con-full tm-col-stretched-none e-flex tm-bg-color-over-image e-con e-child\" data-id=\"569a857e\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-c617780 elementor-widget elementor-widget-image\" data-id=\"c617780\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"1024\" height=\"576\" src=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-2-1024x576.png\" class=\"attachment-large size-large wp-image-20890\" alt=\"LLM evaluation suite and runtime dashboard showing pass rate, p95 latency and cost per request\" srcset=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-2-1024x576.png 1024w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-2-300x169.png 300w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-2-768x432.png 768w, https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/ai-integration-inner-2.png 1280w\" sizes=\"(max-width: 1024px) 100vw, 1024px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6c998b88 ha-has-bg-overlay elementor-widget elementor-widget-tm-ele-accordion\" data-id=\"6c998b88\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-accordion.skin-classic\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div id=\"accordion-holder-968309\" class=\"tm-accordion skin-classic\">\r\n\t\r\n  <div class=\"card active\">\r\n    <div class=\"card-header p-0\" id=\"heading751\">\r\n      <h5 class=\"title \" data-bs-toggle=\"collapse\" data-bs-target=\"#collapse751\" aria-expanded=\"true\" aria-controls=\"collapse751\">\r\n        <span class=\"text\">Can AI be added to an application that already exists?<\/span>\r\n        <span class=\"accordion-controls-icon\"><svg class=\"e-font-icon-svg e-fas-chevron-down\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z\"><\/path><\/svg><\/span>\r\n      <\/h5>\r\n    <\/div>\r\n    <div id=\"collapse751\" class=\"collapse show\" aria-labelledby=\"heading751\" data-bs-parent=\"#accordion-holder-968309\">\r\n      <div class=\"card-body\">\r\n        Yes. If the existing application and its data allow it, an AI feature can be added without rebuilding the whole system.      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"card \">\r\n    <div class=\"card-header p-0\" id=\"heading752\">\r\n      <h5 class=\"title collapsed\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapse752\" aria-expanded=\"false\" aria-controls=\"collapse752\">\r\n        <span class=\"text\">Do I need to know which AI model I want to use?<\/span>\r\n        <span class=\"accordion-controls-icon\"><svg class=\"e-font-icon-svg e-fas-chevron-down\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z\"><\/path><\/svg><\/span>\r\n      <\/h5>\r\n    <\/div>\r\n    <div id=\"collapse752\" class=\"collapse \" aria-labelledby=\"heading752\" data-bs-parent=\"#accordion-holder-968309\">\r\n      <div class=\"card-body\">\r\n        No. The choice is made based on the function that needs to be implemented, the data, the required quality, the speed and the cost.      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"card \">\r\n    <div class=\"card-header p-0\" id=\"heading753\">\r\n      <h5 class=\"title collapsed\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapse753\" aria-expanded=\"false\" aria-controls=\"collapse753\">\r\n        <span class=\"text\">Can the AI use our own data?<\/span>\r\n        <span class=\"accordion-controls-icon\"><svg class=\"e-font-icon-svg e-fas-chevron-down\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z\"><\/path><\/svg><\/span>\r\n      <\/h5>\r\n    <\/div>\r\n    <div id=\"collapse753\" class=\"collapse \" aria-labelledby=\"heading753\" data-bs-parent=\"#accordion-holder-968309\">\r\n      <div class=\"card-body\">\r\n        Yes, as long as there is a clear way to access it and the right limits have been defined. Depending on the case, search, RAG or a direct connection to specific data sources can be used.      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"card \">\r\n    <div class=\"card-header p-0\" id=\"heading754\">\r\n      <h5 class=\"title collapsed\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapse754\" aria-expanded=\"false\" aria-controls=\"collapse754\">\r\n        <span class=\"text\">What happens if the AI gives a wrong answer?<\/span>\r\n        <span class=\"accordion-controls-icon\"><svg class=\"e-font-icon-svg e-fas-chevron-down\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z\"><\/path><\/svg><\/span>\r\n      <\/h5>\r\n    <\/div>\r\n    <div id=\"collapse754\" class=\"collapse \" aria-labelledby=\"heading754\" data-bs-parent=\"#accordion-holder-968309\">\r\n      <div class=\"card-body\">\r\n        AI features should not be designed on the assumption that every answer will always be correct. Depending on the use, validation, limits, evaluation of results or human confirmation before critical actions can be added.      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"card \">\r\n    <div class=\"card-header p-0\" id=\"heading755\">\r\n      <h5 class=\"title collapsed\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapse755\" aria-expanded=\"false\" aria-controls=\"collapse755\">\r\n        <span class=\"text\">How much does using AI cost after development?<\/span>\r\n        <span class=\"accordion-controls-icon\"><svg class=\"e-font-icon-svg e-fas-chevron-down\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z\"><\/path><\/svg><\/span>\r\n      <\/h5>\r\n    <\/div>\r\n    <div id=\"collapse755\" class=\"collapse \" aria-labelledby=\"heading755\" data-bs-parent=\"#accordion-holder-968309\">\r\n      <div class=\"card-body\">\r\n        The running cost depends on the model, the number of requests, the size of the data and how the feature is used. These are taken into account during design so the cost is understood before the feature goes into production.      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <div class=\"card \">\r\n    <div class=\"card-header p-0\" id=\"heading756\">\r\n      <h5 class=\"title collapsed\" data-bs-toggle=\"collapse\" data-bs-target=\"#collapse756\" aria-expanded=\"false\" aria-controls=\"collapse756\">\r\n        <span class=\"text\">Does every AI feature have to use the same model?<\/span>\r\n        <span class=\"accordion-controls-icon\"><svg class=\"e-font-icon-svg e-fas-chevron-down\" viewBox=\"0 0 448 512\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><path d=\"M207.029 381.476L12.686 187.132c-9.373-9.373-9.373-24.569 0-33.941l22.667-22.667c9.357-9.357 24.522-9.375 33.901-.04L224 284.505l154.745-154.021c9.379-9.335 24.544-9.317 33.901.04l22.667 22.667c9.373 9.373 9.373 24.569 0 33.941L240.971 381.476c-9.373 9.372-24.569 9.372-33.942 0z\"><\/path><\/svg><\/span>\r\n      <\/h5>\r\n    <\/div>\r\n    <div id=\"collapse756\" class=\"collapse \" aria-labelledby=\"heading756\" data-bs-parent=\"#accordion-holder-968309\">\r\n      <div class=\"card-body\">\r\n        No. Different features can have different requirements. A different model or provider can be used depending on the quality, speed and cost each case needs.      <\/div>\r\n    <\/div>\r\n  <\/div>\r\n\t\t<\/div>\r\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-72cc0840 e-con-full tm-col-stretched-none e-flex tm-bg-color-over-image e-con e-child\" data-id=\"72cc0840\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;_ha_eqh_enable&quot;:false}\">\n\t\t<div class=\"elementor-element elementor-element-63038be5 e-con-full e-flex tm-col-stretched-none tm-bg-color-over-image e-con e-child\" data-id=\"63038be5\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-9f2b3c7 elementor-widget elementor-widget-tm-ele-text-editor\" data-id=\"9f2b3c7\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"tm-text-editor\" >\r\n\t\t<h4>More Services<\/h4><p><\/p>\t\t<\/div>\r\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-3391ae5f elementor-widget__width-initial elementor-absolute elementor-widget-divider--view-line elementor-widget elementor-widget-divider\" data-id=\"3391ae5f\" data-element_type=\"widget\" data-e-type=\"widget\" data-settings=\"{&quot;_position&quot;:&quot;absolute&quot;}\" data-widget_type=\"divider.default\">\n\t\t\t\t\t\t\t<div class=\"elementor-divider\">\n\t\t\t<span class=\"elementor-divider-separator\">\n\t\t\t\t\t\t<\/span>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-247ec524 elementor-widget elementor-widget-tm-ele-navigation-menu\" data-id=\"247ec524\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-navigation-menu.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"tm-sc-simple-nav-menu\"><ul id=\"menu-services-links\" class=\"\"><li id=\"menu-item-20082\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-20082\"><a href=\"https:\/\/offline-web.com\/en\/vue-migration\/\"><i class=\"tm-nav-arrow-icon  flaticon-common-arrow-right\"><\/i>Application modernization<\/a><\/li>\n<li id=\"menu-item-20083\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-20083\"><a href=\"https:\/\/offline-web.com\/en\/web-app-development\/\"><i class=\"tm-nav-arrow-icon  flaticon-common-arrow-right\"><\/i>Custom web application development<\/a><\/li>\n<li id=\"menu-item-20084\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-20084\"><a href=\"https:\/\/offline-web.com\/en\/excel-to-dashboard\/\"><i class=\"tm-nav-arrow-icon  flaticon-common-arrow-right\"><\/i>Excel to Web App<\/a><\/li>\n<li id=\"menu-item-20085\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-20085\"><a href=\"https:\/\/offline-web.com\/en\/jquery-to-vue-migration\/\"><i class=\"tm-nav-arrow-icon  flaticon-common-arrow-right\"><\/i>jQuery application modernization<\/a><\/li>\n<li id=\"menu-item-22467\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-22467\"><a href=\"https:\/\/offline-web.com\/en\/nuxt-migration\/\"><i class=\"tm-nav-arrow-icon  flaticon-common-arrow-right\"><\/i>Nuxt 4 migration<\/a><\/li>\n<li id=\"menu-item-20897\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-20897\"><a href=\"https:\/\/offline-web.com\/en\/ai-integration\/\"><i class=\"tm-nav-arrow-icon  flaticon-common-arrow-right\"><\/i>AI Features for Vue &#038; Nuxt<\/a><\/li>\n<li id=\"menu-item-20199\" class=\"menu-item menu-item-type-post_type menu-item-object-page menu-item-20199\"><a href=\"https:\/\/offline-web.com\/en\/vanilla-js-to-vue-migration\/\"><i class=\"tm-nav-arrow-icon  flaticon-common-arrow-right\"><\/i>Vanilla JavaScript application modernization<\/a><\/li>\n<\/ul><\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-6e8f8363 e-con-full tm-col-stretched-none e-flex tm-bg-color-over-image e-con e-child\" data-id=\"6e8f8363\" data-element_type=\"container\" data-e-type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;,&quot;_ha_eqh_enable&quot;:false}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6e9a9ded elementor-widget elementor-widget-tm-ele-text-editor\" data-id=\"6e9a9ded\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"tm-text-editor\" >\r\n\t\t<h4>Get in touch<\/h4>\t\t<\/div>\r\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6c30e07a elementor-widget elementor-widget-tm-ele-text-editor-advanced\" data-id=\"6c30e07a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-text-editor-advanced.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"tm-text-editor-advanced\">\r\n\t\t\t\t\t<div class=\"each-item elementor-repeater-item-f5252c0\" >\r\n\t\t\t\t<p>Athens, Greece, working remotely with EU &amp; US teams<\/p>\t\t\t\t<\/div>\r\n\t\t\t\t\t\t\t\t<div class=\"each-item elementor-repeater-item-7af36a6\" >\r\n\t\t\t\t<p>info@offline-web.com<\/p>\t\t\t\t<\/div>\r\n\t\t\t\t\t\t<\/div>\r\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-40a30e43 elementor-widget elementor-widget-tm-ele-iconbox\" data-id=\"40a30e43\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-iconbox.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"tm-sc-icon-box icon-box icon-left font-icon icon-left animate-hover icon-rotate-y\">\r\n\t\r\n  \t<div class=\"icon-box-wrapper\">\r\n\t\t\r\n\t\t<div class=\"icon-wrapper\">\r\n\t\t<div class=\"icon icon-default icon-type-font-icon icon-size-default\">\r\n\t\t\t<i aria-hidden=\"true\" class=\" flaticon-common-technology\"><\/i>\t\t<\/div>\r\n\r\n\t\t\t<\/div>\r\n\t\t\t<div class=\"icon-text\">\r\n\t\t\t\t\t\t<div class=\"content\">Complete the form with the basic information. You will receive a short questionnaire that takes about 10 minutes, followed by a first estimate of cost and timeline based on your answers.<\/div>\r\n\t\t\t\r\n\t\t\t\t<h5 class=\"icon-box-title \">\r\n\t\t\t\t\t\t\tGet a first estimate\t\t\t\t\t<\/h5>\r\n\t\t\t\t\t\r\n\t\t\t\r\n\t\r\n\t\t\t\t\t<\/div>\r\n\t\t<div class=\"clearfix\"><\/div>\r\n\t<\/div>\r\n<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-4c131c9 tm-contact-form-7-button-full-width elementor-widget elementor-widget-tm-ele-contact-form-7\" data-id=\"4c131c9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"tm-ele-contact-form-7.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<div class=\"tm-contact-form-7-wrapper\">\r\n\t\t\t\t<div class=\"tm-contact-form tm-contact-form-7 tm-contact-form-4c131c9 placeholder-show tm-contact-form-align-default\">\n<div class=\"wpcf7 no-js\" id=\"wpcf7-f6-o1\" lang=\"en-US\" dir=\"ltr\" data-wpcf7-id=\"6\">\n<div class=\"screen-reader-response\"><p role=\"status\" aria-live=\"polite\" aria-atomic=\"true\"><\/p> <ul><\/ul><\/div>\n<form action=\"\/en\/wp-json\/wp\/v2\/pages\/20895#wpcf7-f6-o1\" method=\"post\" class=\"wpcf7-form init\" aria-label=\"Contact form\" novalidate=\"novalidate\" data-status=\"init\">\n<fieldset class=\"hidden-fields-container\"><input type=\"hidden\" name=\"_wpcf7\" value=\"6\" \/><input type=\"hidden\" name=\"_wpcf7_version\" value=\"6.1.6\" \/><input type=\"hidden\" name=\"_wpcf7_locale\" value=\"en_US\" \/><input type=\"hidden\" name=\"_wpcf7_unit_tag\" value=\"wpcf7-f6-o1\" \/><input type=\"hidden\" name=\"_wpcf7_container_post\" value=\"0\" \/><input type=\"hidden\" name=\"_wpcf7_posted_data_hash\" value=\"\" \/><input type=\"hidden\" name=\"_wpcf7_recaptcha_response\" value=\"\" \/>\n<\/fieldset>\n<div class=\"contact\">\n  <div class=\"row g-3\">\n    <div class=\"col-sm-6\">\n       <label for=\"fname\">Name *<\/label>\n       <span class=\"wpcf7-form-control-wrap\" data-name=\"your-name\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text wpcf7-validates-as-required form-control\" autocomplete=\"name\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"Jane Doe\" value=\"\" type=\"text\" name=\"your-name\" \/><\/span>\n    <\/div>\n    <div class=\"col-sm-6\">\n       <label for=\"femail\">Email *<\/label>\n       <span class=\"wpcf7-form-control-wrap\" data-name=\"your-email\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-email wpcf7-validates-as-required wpcf7-text wpcf7-validates-as-email form-control\" autocomplete=\"email\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"you@example.com\" value=\"\" type=\"email\" name=\"your-email\" \/><\/span>\n    <\/div>\n    <div class=\"col-sm-12\">\n       <label for=\"fcompany\">Company or website (optional)<\/label>\n       <span class=\"wpcf7-form-control-wrap\" data-name=\"your-company\"><input size=\"40\" maxlength=\"400\" class=\"wpcf7-form-control wpcf7-text form-control\" aria-invalid=\"false\" placeholder=\"Company name or website, if you have one\" value=\"\" type=\"text\" name=\"your-company\" \/><\/span>\n       <small class=\"form-hint\">A link helps me scope your project faster.<\/small>\n    <\/div>\n    <div class=\"col-sm-12\">\n       <label for=\"fservice\">Which service? *<\/label>\n       <span class=\"wpcf7-form-control-wrap\" data-name=\"your-service\"><select class=\"wpcf7-form-control wpcf7-select wpcf7-validates-as-required form-control\" aria-required=\"true\" aria-invalid=\"false\" name=\"your-service\"><option value=\"\">&#8212;Please choose an option&#8212;<\/option><option value=\"Vue 2 to 3 migration\">Vue 2 to 3 migration<\/option><option value=\"jQuery to Vue migration\">jQuery to Vue migration<\/option><option value=\"Nuxt migration\">Nuxt migration<\/option><option value=\"Vanilla JS to Vue migration\">Vanilla JS to Vue migration<\/option><option value=\"Excel to web app \/ dashboard\">Excel to web app \/ dashboard<\/option><option value=\"Custom web app development\">Custom web app development<\/option><option value=\"AI features \/ LLM integration\">AI features \/ LLM integration<\/option><option value=\"Something else\">Something else<\/option><\/select><\/span>\n    <\/div>\n    <div class=\"col-sm-12\">\n       <label for=\"fmessage\">What do you want to build or fix? *<\/label>\n       <span class=\"wpcf7-form-control-wrap\" data-name=\"your-message\"><textarea cols=\"40\" rows=\"4\" maxlength=\"2000\" class=\"wpcf7-form-control wpcf7-textarea wpcf7-validates-as-required form-control\" aria-required=\"true\" aria-invalid=\"false\" placeholder=\"e.g. Migrate a Vue 2 dashboard to Vue 3, or turn an Excel workflow into a web app. A sentence or two is enough.\" name=\"your-message\"><\/textarea><\/span>\n    <\/div>\n    <div class=\"col-sm-12\">\n       <input class=\"wpcf7-form-control wpcf7-submit has-spinner btn btn-theme-colored2\" type=\"submit\" value=\"Get a first estimate\" \/>\n    <\/div>\n    <div class=\"col-sm-12\">\n       <p class=\"form-sla\">Complete the short questionnaire and I'll prepare a first estimate of cost and timeline.<\/p>\n       <p class=\"offline-recaptcha-note\">This site is protected by reCAPTCHA and the Google <a href=\"https:\/\/policies.google.com\/privacy\" target=\"_blank\" rel=\"noopener\">Privacy Policy<\/a> and <a href=\"https:\/\/policies.google.com\/terms\" target=\"_blank\" rel=\"noopener\">Terms of Service<\/a> apply.<\/p>\n    <\/div>\n  <\/div>\n<\/div><div class=\"wpcf7-response-output\" aria-hidden=\"true\"><\/div>\n<\/form>\n<\/div>\n<\/div>\r\n\t\t\t<\/div>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>Add assistants, retrieval, agents and automation to an existing or new product with controlled data access and cost.<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_acf_changed":false,"footnotes":""},"class_list":["post-20895","page","type-page","status-publish","hentry"],"acf":[],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v27.8 (Yoast SEO v28.1) - https:\/\/yoast.com\/product\/yoast-seo-premium-wordpress\/ -->\n<title>AI integration for web applications | OFFLINE<\/title>\n<meta name=\"description\" content=\"Add AI assistants, RAG, data search, agents and automation to web applications with controlled data access, behavior and cost.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/offline-web.com\/en\/ai-integration\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"AI integration for web applications | OFFLINE\" \/>\n<meta property=\"og:description\" content=\"Add AI assistants, RAG, data search, agents and automation to web applications with controlled data access, behavior and cost.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/offline-web.com\/en\/ai-integration\/\" \/>\n<meta property=\"og:site_name\" content=\"offline-web.com\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/profile.php?id=61565994551139\" \/>\n<meta property=\"article:modified_time\" content=\"2026-09-21T11:38:48+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1200\" \/>\n\t<meta property=\"og:image:height\" content=\"630\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:title\" content=\"AI integration for web applications\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration.png\" \/>\n<meta name=\"twitter:site\" content=\"@offline_web\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"5 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\\\/\\\/schema.org\",\"@graph\":[{\"@type\":\"WebPage\",\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/\",\"url\":\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/\",\"name\":\"AI integration for web applications | OFFLINE\",\"isPartOf\":{\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/#primaryimage\"},\"image\":{\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/#primaryimage\"},\"thumbnailUrl\":\"https:\\\/\\\/offline-web.com\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/7-ai-integration-1024x538.png\",\"datePublished\":\"2026-08-04T13:07:14+00:00\",\"dateModified\":\"2026-09-21T11:38:48+00:00\",\"description\":\"Add AI assistants, RAG, data search, agents and automation to web applications with controlled data access, behavior and cost.\",\"breadcrumb\":{\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/#breadcrumb\"},\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/#primaryimage\",\"url\":\"https:\\\/\\\/offline-web.com\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/7-ai-integration-1024x538.png\",\"contentUrl\":\"https:\\\/\\\/offline-web.com\\\/wp-content\\\/uploads\\\/2026\\\/08\\\/7-ai-integration-1024x538.png\"},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/ai-integration\\\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\\\/\\\/offline-web.com\\\/en\\\/index-saas-startup\\\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"AI integration for web applications\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/#website\",\"url\":\"https:\\\/\\\/offline-web.com\\\/en\\\/\",\"name\":\"offline-web.com\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/#\\\/schema\\\/person\\\/520626b2a7a5c2d1fbeb91e5bd8b4aa3\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\\\/\\\/offline-web.com\\\/en\\\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"en-US\"},{\"@type\":[\"Person\",\"Organization\"],\"@id\":\"https:\\\/\\\/offline-web.com\\\/en\\\/#\\\/schema\\\/person\\\/520626b2a7a5c2d1fbeb91e5bd8b4aa3\",\"name\":\"Stelios Kitziris\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\\\/\\\/offline-web.com\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/0404afea-ad5d-45e2-8111-d489cd7935ab.png\",\"url\":\"https:\\\/\\\/offline-web.com\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/0404afea-ad5d-45e2-8111-d489cd7935ab.png\",\"contentUrl\":\"https:\\\/\\\/offline-web.com\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/0404afea-ad5d-45e2-8111-d489cd7935ab.png\",\"width\":1122,\"height\":1402,\"caption\":\"Stelios Kitziris\"},\"logo\":{\"@id\":\"https:\\\/\\\/offline-web.com\\\/wp-content\\\/uploads\\\/2026\\\/06\\\/0404afea-ad5d-45e2-8111-d489cd7935ab.png\"},\"sameAs\":[\"https:\\\/\\\/offline-web.com\",\"https:\\\/\\\/www.facebook.com\\\/profile.php?id=61565994551139\",\"https:\\\/\\\/www.instagram.com\\\/offline_web_\\\/\",\"https:\\\/\\\/www.linkedin.com\\\/company\\\/offline-web\\\/\",\"https:\\\/\\\/x.com\\\/offline_web\"]}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"AI integration for web applications | OFFLINE","description":"Add AI assistants, RAG, data search, agents and automation to web applications with controlled data access, behavior and cost.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/offline-web.com\/en\/ai-integration\/","og_locale":"en_US","og_type":"article","og_title":"AI integration for web applications | OFFLINE","og_description":"Add AI assistants, RAG, data search, agents and automation to web applications with controlled data access, behavior and cost.","og_url":"https:\/\/offline-web.com\/en\/ai-integration\/","og_site_name":"offline-web.com","article_publisher":"https:\/\/www.facebook.com\/profile.php?id=61565994551139","article_modified_time":"2026-09-21T11:38:48+00:00","og_image":[{"width":1200,"height":630,"url":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration.png","type":"image\/png"}],"twitter_card":"summary_large_image","twitter_title":"AI integration for web applications","twitter_image":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration.png","twitter_site":"@offline_web","twitter_misc":{"Est. reading time":"5 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"WebPage","@id":"https:\/\/offline-web.com\/en\/ai-integration\/","url":"https:\/\/offline-web.com\/en\/ai-integration\/","name":"AI integration for web applications | OFFLINE","isPartOf":{"@id":"https:\/\/offline-web.com\/en\/#website"},"primaryImageOfPage":{"@id":"https:\/\/offline-web.com\/en\/ai-integration\/#primaryimage"},"image":{"@id":"https:\/\/offline-web.com\/en\/ai-integration\/#primaryimage"},"thumbnailUrl":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration-1024x538.png","datePublished":"2026-08-04T13:07:14+00:00","dateModified":"2026-09-21T11:38:48+00:00","description":"Add AI assistants, RAG, data search, agents and automation to web applications with controlled data access, behavior and cost.","breadcrumb":{"@id":"https:\/\/offline-web.com\/en\/ai-integration\/#breadcrumb"},"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/offline-web.com\/en\/ai-integration\/"]}]},{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/offline-web.com\/en\/ai-integration\/#primaryimage","url":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration-1024x538.png","contentUrl":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/08\/7-ai-integration-1024x538.png"},{"@type":"BreadcrumbList","@id":"https:\/\/offline-web.com\/en\/ai-integration\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/offline-web.com\/en\/index-saas-startup\/"},{"@type":"ListItem","position":2,"name":"AI integration for web applications"}]},{"@type":"WebSite","@id":"https:\/\/offline-web.com\/en\/#website","url":"https:\/\/offline-web.com\/en\/","name":"offline-web.com","description":"","publisher":{"@id":"https:\/\/offline-web.com\/en\/#\/schema\/person\/520626b2a7a5c2d1fbeb91e5bd8b4aa3"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/offline-web.com\/en\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"en-US"},{"@type":["Person","Organization"],"@id":"https:\/\/offline-web.com\/en\/#\/schema\/person\/520626b2a7a5c2d1fbeb91e5bd8b4aa3","name":"Stelios Kitziris","image":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/06\/0404afea-ad5d-45e2-8111-d489cd7935ab.png","url":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/06\/0404afea-ad5d-45e2-8111-d489cd7935ab.png","contentUrl":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/06\/0404afea-ad5d-45e2-8111-d489cd7935ab.png","width":1122,"height":1402,"caption":"Stelios Kitziris"},"logo":{"@id":"https:\/\/offline-web.com\/wp-content\/uploads\/2026\/06\/0404afea-ad5d-45e2-8111-d489cd7935ab.png"},"sameAs":["https:\/\/offline-web.com","https:\/\/www.facebook.com\/profile.php?id=61565994551139","https:\/\/www.instagram.com\/offline_web_\/","https:\/\/www.linkedin.com\/company\/offline-web\/","https:\/\/x.com\/offline_web"]}]}},"_links":{"self":[{"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/pages\/20895","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/comments?post=20895"}],"version-history":[{"count":16,"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/pages\/20895\/revisions"}],"predecessor-version":[{"id":21871,"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/pages\/20895\/revisions\/21871"}],"wp:attachment":[{"href":"https:\/\/offline-web.com\/en\/wp-json\/wp\/v2\/media?parent=20895"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}