После выпуска Taro 1.2, Taro получила огромную похвалу и внимание в отрасли: количество звезд на GitHub превышает 19 000, а количество загрузок NPM занимает первое место среди аналогичных фреймворков разработки. углубленное и эффективное сотрудничество.
Taro 1.3 — это версия, которую мы готовили дольше всего: после 6 месяцев разработки, почти 2000 представлений кода и совместного участия почти 100 разработчиков. Мы наконец-то рады представить сегодня Taro 1.3.
Особенности Таро 1.3 включают, но не ограничиваются:
- Поддержите разработку быстрых приложений и мини-программ QQ
- Полная поддержка синтаксиса JSX и React Hooks.
- Значительно улучшить производительность и удобство использования H5
- Taro Doctor
Поддержите разработку быстрых приложений и мини-программ QQ
Режим разработки быстрого приложения очень особенный, его API, система компонентов, библиотека компонентов и другие небольшие программы сильно различаются, а быстрое приложение является лишь стандартом, и каждый производитель Android имеет разные реализации среды выполнения. И эту «твердую кость» окончательно перегрыз Таро.
Как новый контейнер апплета, апплет QQ, как правило, плохо изучен, но Taro также первым реализовал поддержку апплета QQ.
Поддержка быстрых приложений и мини-программ QQ означает, что Taro действительно достигает «полного охвата» основных мини-программ в отрасли. соответствующий код платформы мини-программы. В то же время Taro также стала первой средой разработки в отрасли, которая одновременно поддерживает апплет WeChat, апплет Baidu Smart, апплет ByteDance, апплет Alipay, Quick App и апплет QQ.
Полная поддержка синтаксиса JSX и React Hooks.
Как среда разработки, использующая синтаксис React и JSX, более ранние версии Taro накладывали строгие синтаксические ограничения как на инструменты проверки компилятора, так и на редактор. В Taro 1.3 разработчики могут дать полную волю своему творчеству и воображению и могут писать произвольно.if-else
, вы можете произвольно писать анонимные функции, вы можете поместить JSX в функцию класса, вы также можете поместить его в обычную функцию и так далее. Это можно сделать, если компилятор и ESLint не сообщают об ошибках.
Хотя React Hooks долгое время официально не был стабильным, мы считаем, что эта функция может эффективно упростить режим разработки, повысить эффективность разработки и опыт разработки. Даже если экология и передовой опыт хуков еще не совершенны, мы считаем, что хуки станут основным направлением модели разработки React в будущем и окажут глубокое влияние на будущий состав API других фреймворков. Итак, сначала мы перенесли React Hooks в Taro и написали два небольших примера, чтобы показать, как использовать Hooks в Taro:
V2EX: GitHub.com/nerv JS/таро…
TodoMVC: GitHub.com/nerv JS/таро…
Новый жизненный цикл и контекстный API
В Taro 1.3 мы также реализовали новые функции жизненного цикла React 16.static getDerivedStateFromProps()
а такжеgetSnapshotBeforeUpdate()
. Когда новая функция жизненного цикла внедряется в компонент класса, старая функция жизненного цикла не будет вызываться, и вызов исходной функции жизненного цикла не будет затронут, если новая функция жизненного цикла не используется. В большинстве случаев мы рекомендуем создавать компоненты класса с новым жизненным циклом, так как это снижает накладные расходы на отрисовку и обновление. Подробнее можно посмотретьСвязанная документация.
Taro 1.3 также реализует React 16createContext
,contextType
а такжеuseContext
API. Новый контекст передает обновление компонента, объявляя API, что делает межкомпонентное взаимодействие TARO и обмен статусами более интуитивно понятными. В то же время, напримерreact-redux
Такие популярные библиотеки также основаны наContext
а такжеHooks
Рефакторинг, мы также с нетерпением ждем возможности изучить новые шаблоны разработки и проектирования React/Taro с сообществом.
Значительно улучшить производительность и удобство использования H5
Как наиболее востребованная сторона, помимо мини-программ WeChat, мы всегда направляли важные силы разработчиков на сторону H5. В Taro 1.3 мы оптимизировали способ компиляции кода, реализовали минимальное введение ресурсов и введение по требованию, а также уменьшили размер компиляции исходного минимального проекта примерно на 80%. Это, несомненно, огромное улучшение для стороны H5 с плохими условиями сети.
Количество и качество API-интерфейсов на стороне H5 также значительно выросли.В Taro 1.3 добавлено 28 новых API-интерфейсов H5 и решены сотни проблем, связанных с H5.
Если вас больше интересует производительность H5, вы можете прочитать статью:«Верхняя часть решающей боевой производительности - обновление преобразования и оптимизации Taro H5».
Taro Doctor
Мы также черпали вдохновение у Flutter Doctor для разработки Taro Doctor. Как врач, Taro Doctor может диагностировать проблемы с зависимостями проекта, настройками, структурой и спецификацией кода и пытаться найти решения.
Но в отличие от настоящих докторов, Таро Доктору не нужно ждать в очереди или тратить деньги. Вам просто нужно запустить команду в терминале:taro doctor
, как на графике:
есть еще
В дополнение к вышеперечисленным функциям, в Taro 1.3 было проделано много дополнительной работы, которая может не повлиять на повседневную разработку, но заложить прочную основу для стабильности Taro и больших возможностей в будущем:
Рефакторинг системы параметров компонента (props)
На стороне апплета в Taro 1.0–1.2 мы всегда использовали систему передачи параметров компонентов собственной структуры апплета, но система компонентов апплета не может передавать значение функции или безымянных параметров, и реализация каждого компонента апплета различается. Не то же самое. Чтобы решить эти проблемы, в Taro 1.3 мы реализовали систему передачи параметров набора компонентов. Новая система сделает код, связанный с передачей параметров, более надежным, а также станет основой для поддержки большего количества синтаксиса JSX.
Инструмент командной строки (CLI) Рефакторинг
В Taro 1.3 мы переработали инструмент командной строки для использования TypeScript и постепенно добавили больше тестовых случаев. После рефакторинга мы можем более смело добавлять в CLI новые функции и заменять старые зависимости. В то же время мы также предоставим функции CLI в виде API-интерфейсов, чтобы расширить возможности других инструментов разработки и наших партнеров.
Замена мобильного контейнера
Наш и JingdongARESКомандная работа, поставить оригинальный мобильный контейнерexpoЗаменен глубоко настроенным JDReact. JDReact значительно улучшает управляемость мобильного Taro, позволяя нам прорватьсяexpo
Ограничено введением собственного мобильного кода, предоставляются настраиваемые функции и API, а производительность и стабильность будут лучше.
Поддержка разработки подключаемых модулей апплета
Подключаемый модуль апплета — это отличная функция, представленная апплетом, которая может значительно повысить скорость повторного использования кода, уменьшить размер пакета и обеспечить большое удобство для разработчиков.В настоящее время апплет WeChat и Alipay уже поддерживает подключаемый модуль. в функции. Начиная с версии 1.3, Taro поддерживает прямую разработку подключаемых модулей апплетов WeChat и Alipay, что означает, что проект Taro будет беспрепятственно подключаться к подключаемым модулям апплета, и больше нет затрат на переключение режима разработки.
Поддержка «Мини-программы облачной разработки»
"Mini Program Cloud Development" — это очень мощная функция, предоставляемая WeChat Mini Program и Tencent Cloud Team. Это бессерверная служба, которая предоставляет разработчикам три возможности "Cloud Function", "Cloud Database" и "Cloud File Storage", а также инкапсуляцию эти возможности в конкретных интерфейсах могут помочь разработчикам быстро создавать серверные службы для мини-программ WeChat. Чтобы позволить разработчикам Taro использовать возможности «Мини-программы облачной разработки», Taro также добавила поддержку «Мини-программы облачной разработки», предоставила шаблон инициализации для «Мини-программы облачной разработки» и интегрировала мини-программу, связанную с облаком. API-интерфейсы инкапсулированы для удобства использования разработчиками. В то же время «Mini Program Cloud Development» предоставила версию SDK H5, а Taro поддерживает унифицированную инкапсуляцию методов вызова Mini Program и H5, помогая разработчикам быстро создавать бессерверные мультитерминальные приложения.
Обновление совместимости
Как упоминалось ранее, Taro 1.3 — это большая версия с самым длительным временем приготовления и наибольшим количеством функций, а также рефакторинг нижнего уровня Taro, поэтому обновление версии 1.3 приносит следующие две проблемы совместимости.
Функции прослушивателя событий в JSX должны иметь область действия
В предыдущей версии Taro функция прослушивателя событий, привязанная к JSX, могла получить доступ к экземпляру компонента без привязки какой-либо области, например
import Taro, { Component, Config } from '@tarojs/taro'
import { View, Button } from '@tarojs/components'
export default class Test extends Component {
state = {
hello: 'noclick'
}
clickHandler () {
this.setState({
hello: 'click'
})
}
render () {
return (
<View className={styles.index}>
<Button onClick={this.clickHandler}>点击</Button>
</View>
)
}
}
В приведенном выше примере<Button />
Событие щелчка, привязанное к кнопке, могло нормально выполняться в предыдущей версии, и Taro по умолчанию будетclickHandler
Область видимости привязана к текущему экземпляру компонента, но это не соответствует реальной ситуации в React, поэтому в версии 1.3 мы исправили эту проблему, теперь функция прослушивания событий в JSX должна быть привязана к области видимости, иначе будет сообщено об ошибке.
Часть JSX приведенного выше кода можно изменить следующим образом.
render () {
return (
<View className={styles.index}>
<Button onClick={this.clickHandler.bind(this)}>点击</Button>
</View>
)
}
или вы также можетеconstructor
Функция будет привязана заранее в области видимости,
constructor () {
this.clickHandlerBind = this.clickHandler.bind(this)
}
render () {
return (
<View className={styles.index}>
<Button onClick={this.clickHandlerBind}>点击</Button>
</View>
)
}
Другой способ - положитьclickHandler
Написанный в виде стрелочной функции, этот метод прекрасно работает как в старой, так и в новой версии.
Временно невозможно использовать компоненты Taro в собственных приложениях.
В предыдущих версиях компоненты, скомпилированные с помощью Taro, можно было напрямую использовать в нативных проектах для улучшения возможности повторного использования, но в версии 1.3 из-за полного рефакторинга системы реквизитов компонентов их нельзя временно использовать в нативных проектах после обновления до компонентов Taro 1.3. мы активно работаем над этой проблемой и продолжим поддерживать эту функцию в последующих выпусках.
вне кадра
В дополнение к улучшению многотерминальной адаптации в версии 1.3 и улучшению опыта разработки фреймворка и эффективности разработки, команда Taro также приложила много усилий в экологическом строительстве, включая недавно обновленный официальный сайт, рынок материалов/плагинов, и независимое сообщество/форум.
Мы считаем, что цена жизни Таро — это жесткая сила в качестве основы для развития, но именно экология, сообщество и партнеры действительно определяют, как далеко может зайти Таро. В обновлении 1.3 мы значительно увеличили свои силы и теперь приглашаем вас принять участие или понаблюдать за экологическим и общественным строительством Таро:
- Официальный сайт Таро:taro.jd.com
- Рынок материалов Таро:taro-ext.jd.com
- Сообщество Таро:taro-club.jd.com
- GitHub: github.com/NervJS/taro