Install any skill in seconds. Free to start, no credit card required.
Get Started Free →rohitg00/mobile-development
Mobile development patterns for React Native and Flutter including navigation, state management, and responsive design
Passed 19 of 22 test cases with the skill, and 15 of 22 without it.
and 3 more in the full report
4 fixed15 passed either way3 still failing0 broke
Tokens, turns and time describe resource use, not a dollar price.
One of 4 test cases the skill fixed. Same model, same prompt, with and without the skill.
In a React Native grid component, what exact screen width thresholds differentiate phone, tablet, and desktop viewports, and how many columns should each layout render?
| Checked | Without skill | With skill |
|---|---|---|
| Phone width threshold is set to less than 768 rendering 1 column. | Missed | Passed |
| Tablet width threshold is set between 768 and 1024 rendering 2 columns. | Missed | Passed |
| Desktop column count is set to 3 for width 1024 or greater. | Missed | Passed |
The instructions your model reads when the skill loads.
import { View, Text, FlatList, StyleSheet, Platform } from "react-native";
import { SafeAreaView } from "react-native-safe-area-context";
interface Product {
id: string;
name: string;
price: number;
image: string;
}
function ProductList({ products }: { products: Product[] }) {
return (
<SafeAreaView style={styles.container}>
<FlatList
data={products}
keyExtractor={(item) => item.id}
renderItem={({ item }) => <ProductCard product={item} />}
contentContainerStyle={styles.list}
ItemSeparatorComponent={() => <View style={styles.separator} />}
ListEmptyComponent={<EmptyState message="No products found" />}
initialNumToRender={10}
maxToRenderPerBatch={10}
windowSize={5}
/>
</SafeAreaView>
);
}
const styles = StyleSheet.create({
container: {
flex: 1,
backgroundColor: "#fff",
},
list: {
padding: 16,
test cases passed, vs 15 / 22 without
More skills from the same source and nearby in the registry, with their headline benchmark lift.