RECOIL (Retro Computer Image Library) is a viewer of pictures in native formats of 20th century computers: Amiga, Amstrad CPC, Apple II, Atari 8-bit, Atari Portfolio, Atari ST/TT/Falcon, BBC Micro, Commodore VIC-20, Commodore 16, Commodore 64, Commodore 128, Electronika BK, FM Towns, Macintosh 128K, MSX, NEC PC-80/88/98, Oric, Psion Series 3, SAM Coupé, Sharp X68000, Tandy 1000, Timex 2048, TRS-80, TRS-80 Color Computer, ZX81 and ZX Spectrum.
RECOIL opens over 500 different file formats. See http://recoil.sourceforge.net/ for the full list of supported formats and some example files.
Скриншоты
Что нового
- Версия: PC
- Обновлено: 2023-03-28 07:25:01 UTC
New Atari ST/TT/Falcon formats: Grafix (GRX), UIMG (BP1/BP2/BP4/BP6/BP8/C01/C02/C04/C06/C08/C16/C24/C32).
New Sam Coupe formats: SS1, SS2, SS3, LCE.
More variants of formats: ABK, G9B, SS4, TIM.
Fixed colors in: CWG, PI4, PI5, MSX2+ YJK mode.
Цена
- Сегодня: Бесплатно
- Минимум: Бесплатно
- Максимум: Бесплатно
- Дата выпуска: 2016-11-30 07:24:56 UTC
Отслеживайте цены » Добавить в список
Budget Car Amplifier. You won’t Believe the Power! Recoil Audio RED600.1
Разработчик
- Piotr Fusik
- Платформы:Android Приложения (1) Windows Приложения (1)
- Списки: 0 + 0
- Очки: 0 + 114 i
- Рейтинги: 0
- Отзывы: 0
- Скидки: 0
- Видео: 0
- RSS:Подписаться
Источник: appagg.com
Recoil JS – новый store manager для React
Сегодня я хочу вам представить относительно новую библиотеку для управления глобальным состоянием приложения – Recoil JS. Как и React является open-source проектом при поддержке разработчиков из Meta (запрещенная в России экстремистская организация). Пока что является экспериментальной, на момент написании статьи имеет версию 0.4.1.
Recoil располагает себя как библиотека исключительно для React, что поможет решать проблемы в диапазоне данного фреймворка, плюс ко всему разработчики, занимающиеся Recoil и React, из одной компании.
Так же стоит отметить относительно малый размер библиотеки, хотя с новыми версиями это может измениться.
Основные принципы и примеры
На примере небольшого ToDo приложения я постараюсь показать функционал RecoilJS. Ссылка на код будет в конце статьи.
Recoil состояние работает на атомах и селекторах.
У нас есть React компоненты, которые лежат, так сказать, в слое самого приложения, и над всем расположен Recoil store, который состоит из похожих на React компоненты атомов. Атом должен быть с уникальным ключом, что помогает самому приложению, и в отладке. Если нужно создать какую-то группу атомов, нужно использовать atomFamily, который под одним ключом будет хранить несколько атомов. Ниже пример самого обычного атома, который мы будем использовать для определения темы приложения.
Обзор RecoilJS. Пишем приложение c ReactJS и Recoil
type Theme = ‘light’ | ‘dark’ const theme = atom(< key: ‘theme’, default: ‘light’, >);
Атом может передавать свое состояние в любую часть React приложения при помощи useRecoilState, который по сути является аналогией useState. С помощью данного хука можно использовать состояние атома или изменить его. Если состояние изменится, то все компоненты, которые используют данный атом, то есть подписаны на его изменение, тоже поменяют свое состояние на новое.
export const useFooterStyles = (): CSSProperties => < const appTheme = useRecoilValue(theme); return < display: ‘flex’, justifyContent: ‘space-between’, alignItems: ‘center’, backgroundColor: appTheme === ‘light’ ? ‘#AAD5FF’ : ‘#4A7496’, >>;
Селектор использует имеющиеся атомы, и изменяет поведение получения или установки нового значения при помощи чистых функций. Селектор может существовать и в отрыве от атома. Ниже пример селектора для названия кнопки, в зависимости от текущей темы.
type ThemeLabelButton = ‘Light Theme’ | ‘Dark Theme’ export const themeLabelButton = selector(< key: ‘themeLabel’, get: (< get >) => < const appTheme = get(theme); return `$Theme`; > >)
const style = useSwitchThemeStyles(); return ( > type=»primary» onClick= < setAppTheme((currVal) =>currVal === ‘light’ ? ‘dark’ : ‘light’) >> > )
Так же селектор можно использовать для асинхронных запросов.
Для обработки ошибок разработчики библиотеки советуют использовать , а для индикатора загрузки либо React. Suspense, либо хук useRecoilValueLoadable. Ниже пример с React.Suspense. Ниже селектор для загрузки данных.
type ToDoList = < content: Array; error: boolean > type ToDoListElem = < userId: number; id: number; title: string; completed: boolean >const toDoList = selector( < key: ‘ToDoList’, get: async () =>< const res = await fetch(‘https://jsonplaceholder.typicode.com/users/1/todos’); if (res.status !== 200) < return < content: [], error: true >; > return < content: await res.json(), error: false >; > >);
В компоненте он может использоваться, как и обычный селектор.
Если нужно отправить запрос в зависимости от параметра, то необходимо использовать selectorFamily с немного измененным get полем.
export const toDoListQuery = selectorFamily>( < key: ‘ToDoListQuery’, get: query =>async () => < const res = await fetch(`https://jsonplaceholder.typicode.com/users/$/todos`); if (res.status !== 200) < return < content: [], error: true >; > return < content: await res.json(), error: false >; > >);
Теперь при нажатии на кнопку мы будем изменять userId, и это в свою очередь будет вызывать новый шаг жизненного цикла у хука, что в свою очередь приведет к новому запросу, с уже измененным параметром.
export const Content = (): JSX.Element => < const style = useContentStyles(); const [userId, setUserId] = useState(1) const appToDoList = useRecoilValue(toDoListQuery(< userId >)); return > style= headStyle=> )> setUserId((prevState) => prevState + 1)>>Next >
Так же достаточно много дополнительного функционала, по типу useEffect для атома, useRecoilCallback (альтернатива useCallback) со Snapshots, useRecoilTransaction для Batching-а и прочее. Сильно видна связь данной библиотеки и React-а.
В целом работу Recoil с React компонентами можно описать одной картинкой.
Recoil еще слишком молодая библиотека и имеет много проблем, при неправильном использовании можно нагородить большое количество ошибок, к примеру, нужно сразу установить принцип выбора ключей в большом проекте (например `$Theme`, а глобальные называть как обычно), нужно следить за тем, чтобы атом менялся либо через селектор, либо через свой собственный setRecoilState.
Я бы не стал его использовать пока что для коммерческих проектов, но поддержать разработчиков библиотеки своим вниманием или, что еще лучше, собственноручным вкладом в проект, стоит.
Источник: habr.com
Современное приложение выбирает… Redux, Context или Recoil?
Поскольку веяния в управлении глобальным состоянием постоянно меняются, то выбор в пользу того или иного варианта может оказаться затруднительным. Долгое время таким предпочтительным вариантом была Redux . Однако после того, как Context API с возможностью управления состоянием стал частью React, многие поспешили объявить о преждевременной кончине Redux. И вот теперь с появлением новоиспеченного проекта Recoil, разработанного Facebook, в нашем распоряжении оказывается библиотека для React, которая с легкостью интегрируется с ее новейшими функциональностями.
Какая же из трех библиотек лучше всего подходит для проекта? В данной статье мы проведем интеграцию простого приложения с каждой из них, поле чего сравним полученные результаты и подведем итоги. Здесь я делюсь лично своими наблюдениями, не претендуя на истину в высшей инстанции, поскольку у каждого в конечном счете сформируются собственные предпочтения. Но обещаю вам быть максимально объективным и предоставить сравнительные характеристики производительности, добытые опытным путем.
Перейдя по ссылке https://github.com/jogilvyt/redux-context-recoil , вы сможете ознакомиться с итоговым вариантом кода (каждая интеграция представлена в отдельной ветке).
Приложение
Я создал простое приложение-планировщик, отображающее список элементов с возможностью их удаления и форму для добавления новых. Оно вызывает фиктивный API с setTimeout для получения результатов, создания элемента и удаления его из списка:
Базовое приложение-планировщик
Для получения базовой меры производительности я начал вовсе не с управления глобальным состоянием. При загрузке приложения выполнялись 3 процесса отрисовки: начальная отрисовка экрана загрузки заняла 5.3 мс, ана отрисовкупосле загрузки всех элементов ушло 7 мс :
Отрисовка после получения результатов
Поскольку это простое приложение, то любые отличия в производительности будут незначительными, чего нельзя сказать о работе с более сложным вариантом. Тем не менее данный эксперимент поможет составить общее представление о влиянии каждой из библиотек на производительность.
Информация к размышлению
Начиная работу над новым проектом, всегда следует удостовериться в выборе правильных инструментов, поэтому сейчас самое время спросить себя, нужно ли вам вообще управление глобальным состоянием. Множество простых приложений будут вполне работоспособными и более удобными для обслуживания без дополнительных затрат ресурсов, связанных со сторонней библиотекой или даже Context API.
Будучи UI-инженерами, нам свойственно с легкомысленным энтузиазмом хвататься за каждый новенький инструмент. Не стоит попадаться в эту ловушку — подумайте, нужна ли вам система управления глобальным состоянием, прежде чем вкладывать силы в ее интеграцию.
Redux
Redux — наиболее проверенный временем инструмент управления глобальным состоянием. Он не зависит от фреймворка, чем объясняется его востребованность в мире фронтенд-разработки. Кроме того, какое-то время эта библиотека была единственным средством выхода за пределы локального состояния. Однако в связи с недавним добавлением Context API и появлением нового конкурента в лице Recoil сможет ли Redux отстоять свои позиции в современном приложении React?
Производительность
Прежде всего, проясним вопрос производительности. При начальной загрузке происходит всего 2 этапа отрисовки против 3-х в базовом случае. Однако общая продолжительность немного увеличивается — 6 мс уходит на отрисовку состояния загрузки и 10 мс — на список после получения элементов.
Redux: отрисовка после получения результатов
После добавления нового элемента отрисовка заняла 2.9 мс , а после его удаления — 2 мс . В целом, производительность довольно высокая за исключением изначальных затрат ресурсов при загрузке приложения.
Удобство для разработчика
В связи с этим нельзя не сказать об одном из значительных недостатков Redux — мне всегда казалось, что для обеспечения ее работы требуется много шаблонного кода. Да и сложно не повторяться, учитывая применение многочисленных редукторов в приложении. В данном примере у нас есть хранилище, редуктор и 3 действия — похоже, намечается немало кода для такого простого приложения.
С другой стороны, Redux обеспечивает наилучшие практики для разработки. Она предоставляет простой шаблон, который избавляет от необходимости продумывать большое количество решений по реализации функциональности. Мне также нравится тот факт, что Redux позволяет абстрагировать API-запросы в действия, сосредотачивая управление в одном месте. И вместо того, чтобы ворошить компоненты в попытке определить, какой из них делает запрос, намного удобнее сразу знать, куда перейти для обновления API-вызова.
Удобство для пользователя
Управление состояниями загрузки и ошибок с помощью Redux требует пользовательской реализации. Лично я отслеживаю в редукторе глобальную переменную isLoading и затем управляю состоянием загрузки для добавления или удаления элементов в каждом компоненте. Это самый обычный прием, который несложно реализовать. Но, забегая вперед, — в этой области никто не сравнится с Recoil.
Context API
В версии 16.3 к React был добавлен новый Context API, обеспечивающий обмен состоянием между компонентами без необходимости “поднимать” его к общему родителю. В настоящее время его широко используют как способ хранения глобального состояния, особенно для более статических данных, таких как информация о пользователе или настройки темы. Сравним его характеристики производительности с Redux.
Производительность
Считается, что Context не отличается высокой производительностью, поскольку при обновлении состояния в Provider каждый компонент, использующий этот инструмент, будет повторно отображаться, даже если соответствующее ему состояние не изменилось.
В нашем приложении при загрузке происходило три этапа отрисовки: начальная заняла 5.9 мс, 2.9 мс ушло на отрисовку после получения данных и 7.9 мс — на отображение элементов списка дел.
Источник: dzen.ru