Tworzenie nowych funkcji przy użyciu wbudowanej AI w Chrome

Thomas Steiner

Data publikacji: 26 maja 2026 r.

Ten post jest zapisem prezentacji Thomasa Steinera na konferencji Google I/O 2026.

Wyobraź sobie, że tworzysz bloga o podróżach, a edytor postów nie tylko przechowuje tekst, ale też aktywnie pomaga Ci w pisaniu. Poznaj Mayę i Ashoka, twórców trAIlblazers. Korzystają oni z wbudowanej AI w Chrome. Dzięki uruchamianiu modeli bezpośrednio na urządzeniu użytkownika deweloperzy unikają wysokich kosztów chmury i opóźnień, a jednocześnie przechowują dane wrażliwe lokalnie.

We współpracy z Build Awesome (wcześniej Eleventy) udostępniliśmy szablon bloga ze wszystkimi funkcjami AI wymienionymi w prezentacji.

Dlaczego wbudowana AI?

  • Oszczędność: brak kosztów wnioskowania w chmurze, wszystkie obliczenia są wykonywane na urządzeniach użytkowników.
  • Prywatność przede wszystkim: dane wrażliwe nigdy nie opuszczają przeglądarki.
  • Funkcje offline: po pobraniu modelu funkcje AI działają bez połączenia z internetem.
  • Wydajność: akceleracja sprzętowa pozwala modelom na urządzeniu konkurować z szybkością chmury (a czasem ją przewyższać).
  • Wnioskowanie hybrydowe: Korzystając z kodów polyfill i narzędzi takich jak Firebase AI Logic, możesz w przypadku nieobsługiwanych urządzeń (np. mobilnych) wrócić do chmury, a na komputerze pozostać w trybie natywnym.

Funkcje AI dla nowoczesnych aplikacji internetowych

Summarizer API

Edytor trAIlblazers używa Summarizer API do automatycznego generowania nagłówków i opisów meta przyjaznych dla SEO.

Przykład: generowanie nagłówka

const blogPost = document.querySelector('.article-body').innerText;
const summarizer = await Summarizer.create({
  type: 'headline',
  sharedContext: 'Write headlines that make people want to read the blog post',
});

for await (const chunk of summarizer.summarizeStreaming(blogPost)) {
  headline.append(chunk);
}

Prompt API (z uporządkowanymi danymi wyjściowymi)

Potrzebujesz konkretnych danych? Używając schematu JSON z Prompt API, możesz sprawić, że AI będzie zwracać przewidywalne formaty. Zespół trAIlblazers używa tej funkcji do:

  • Generowania tagów: sugerowania kategorii takich jak „Przygoda” lub „Plaża” z predefiniowanej listy.
  • Moderowania komentarzy: klasyfikowania komentarzy jako „Bezpieczne” lub „Szkodliwe” przed ich opublikowaniem.

Ułatwienia dostępu do multimediów

Edytor automatyzuje „trudne” części Markdown. Gdy upuścisz obraz, Prompt API (z danymi wejściowymi multimodalnymi) analizuje piksele, aby wygenerować dostępny tekst alternatywny i informacyjne podpisy.

Pisanie i przepisywanie

Dzięki Writer i Rewriter API użytkownicy mogą jednym kliknięciem rozwinąć punkty w pełne akapity i zmienić ton akapitu na „bardziej swobodny” lub „krótszy” .

Bezproblemowe tłumaczenie

The Translator API umożliwia twórcom pisanie treści w języku angielskim i natychmiastowe tłumaczenie ich na hiszpański lub japoński, które mogą następnie dopracować native speakerzy.

Przykład działania interfejsu Translator API.
Twórz treści w języku angielskim za pomocą Translator API i natychmiast tłumacz je na hiszpański i japoński.

Historie sukcesu z całego świata

Wielu partnerów już teraz używa tych interfejsów API w środowisku produkcyjnym. Oto kilka przykładów:

  • Drupal: używa Summarizer API do generowania tagów SEO w CKEditor.
  • Yahoo! Japan: używa Prompt API do moderowania komentarzy społeczności.
  • Trip.com: pomaga kupującym poruszać się po złożonych opcjach rezerwacji lotów dzięki podsumowaniom generowanym przez AI.

Materiały z prezentacji

Chcesz stworzyć własną wersję „trAIlblazers”? Zapoznaj się z tymi materiałami: