Это может свести вас с ума, разгрузите свой код в ChatGPT

Если вы хотите создать простой алгоритм для отслеживания прогресса чтения, вы можете использовать языковую модель OpenAI, ChatGPT.

В этой статье мы покажем вам, как создать трекер чтения с помощью ChatGPT, который может оценивать время, необходимое для чтения статьи, и отслеживать, сколько статьи вы прочитали.

Когда вы пишете контент на Medium, в разделе историй вы сможете увидеть статистику. Ниже показано, как они выглядят

Кроме того, когда вы публикуете историю, вы сможете увидеть время чтения контента.

Medium использует несколько методов для определения читателей статьи. Он учитывает время, потраченное пользователем на статью, когда она находилась в поле зрения, процент прокрутки, скорость прокрутки и многое другое. Эти метрики затем передаются в алгоритм, чтобы понять окончательные цифры и баллы для статьи.

Когда вы просматриваете статью, вы можете перейти к инструментам разработчика и прокрутить до вкладки сети.

Вы сможете найти аналогичный сетевой запрос, я также поделился форматом данных ниже.

Для простоты я попросил ChatGPT создать простой алгоритм для получения этих показателей о читателях.

Вот с чего я начал. Я хотел передать контекст, о котором собираюсь рассказать, и сообщить об этом ИИ. Обычно это помогает получить более релевантные ответы.

На следующем шаге я сузился до читающей части Medium, чтобы узнать, что об этом думает ChatGPT.

Ответы по делу и довольно интересно.

Далее последовала серия запросов на получение алгоритма.

Помните, это был не 100% рабочий код.

Я сказал ChatGPT исправить ошибки, и было здорово увидеть изменения, внесенные в код.

Всегда хорошо, если вы можете поделиться с ИИ более подробной информацией о том, что, по вашему мнению, не работает.

Алгоритм

Простой алгоритм на JavaScript, который может отслеживать количество времени, которое пользователь проводит на странице, и процент страницы, которую он пролистал:

    let timeSpent = 0;
    let startTime;

    // get article content
    const article = document.querySelector("article");
    const articleContent = article.textContent;

    // calculate word count
    const wordCount = articleContent.split(" ").length;

    // estimate time to read
    const averageReadingSpeed = 200; // words per minute
    const estimatedTime = Math.ceil(wordCount / averageReadingSpeed);

    // update reading tracker
    const readingTracker = document.querySelector("#reading-tracker");
    readingTracker.innerHTML = `Estimated time to read: ${estimatedTime} minutes`;

    // track reading progress
    let wordsRead = 0;

    window.addEventListener("scroll", function () {
      const articleHeight = article.offsetHeight;
      const articlePosition = article.getBoundingClientRect().top;
      const windowHeight = window.innerHeight;
      const percentRead = (windowHeight - articlePosition) / articleHeight;
      wordsRead = Math.ceil(percentRead * wordCount);

      // start timer if the article is in view
      if (percentRead > 0 && percentRead < 1 && !startTime) {
        startTime = Date.now();
      }

      // stop timer if the article is not in view
      if (percentRead <= 0 || percentRead >= 1) {
        startTime = null;
      }

      // calculate time spent
      if (startTime) {
        timeSpent += (Date.now() - startTime) / 1000;
        startTime = Date.now();
      }

      let answer = `Words read: ${wordsRead} / ${wordCount} (${Math.floor(percentRead * 100)}%) - Time spent: ${Math.ceil(timeSpent)} seconds - Estimated time to read: ${Math.ceil(estimatedTime * (1 - percentRead))} minutes`;
      readingTracker.innerHTML = answer;
      console.log('Answer = ', answer);
    });

Вот результат

Это конец?

Нет, в этот алгоритм можно внести гораздо больше изменений, чтобы сделать его намного лучше. Если хотите, ChatGPT тоже может это сделать. Но я оставлю это вам в качестве упражнения.

Пример:-

  1. Расчет необходимо настроить для мобильных устройств.
  2. Когда пользователи переходят на другую вкладку, startTime может отдыхать, чтобы убедиться, что мы не добавляем время, когда пользователь отсутствует в статье.
  3. Обновите вычисление, чтобы получить сведения об области просмотра статьи, чтобы сделать его более точным.

Ссылка на файл HTML с исходным кодом

https://pastebin.com/DrR5SYS1

В заключение можно сказать, что использование ИИ, такого как ChatGPT от OpenAI, может значительно снизить нагрузку на разработчиков и повысить их эффективность.

Цель статьи — показать, что с ChatGPT можно сделать многое, но нужно начать исследовать его пределы.

По мере того, как технологии продолжают развиваться, интересно наблюдать, как ИИ будет продолжать революционизировать и оптимизировать процесс разработки.

Пожалуйста, не стесняйтесь следовать за мной, если вам понравилось читать это и вы хотели бы продолжить путешествие со мной. Мне бы это понравилось.